How to position the image relatively - html

Question

Hai I am new in html and css.I need some help.I have 4 images given below.
The main Background image
Link image1
Link image2
Link image13
And I need to look the all images finally like
Final Look
My html is like
<div class="aside__block social-media-follow">
<div class="aside-block__content">
<img src="/media/19134/001.jpg"/>
<img src="/media/19133/Twetter.jpg"/>?
<img src="/media/19133/facebok.jpg"/>
<img src="/media/19133/insta.jpg"/>
</div>
</div>
Can any one help on css to position the social link images.

Answer 1

<div class="aside__block social-media-follow">
<div class="aside-block__content">
<img src="http://i.stack.imgur.com/mxD7P.jpg"/>
<img src="http://i.stack.imgur.com/lBlEE.jpg"/>
<img src="http://i.stack.imgur.com/FbE0s.jpg"/>
</div>
</div>
In css:
.aside-block__content {
background: url("http://i.stack.imgur.com/msmci.jpg") no-repeat;
width: 310px;
height: 100px;
}
.aside-block__content a img{
float: right;
margin-top: 50px;
margin-right: 30px;
}
DEMO : http://jsbin.com/kexam/1/edit

Answer 2

You can put the "follow us" image as a background image and float the icons right with margin-top and right to position them as desired :
FIDDLE
HTML:
<div class="aside__block social-media-follow">
<div class="aside-block__content">
<img src="http://i.stack.imgur.com/lBlEE.jpg"/>
<img src="http://i.stack.imgur.com/mxD7P.jpg"/>
<img src="http://i.stack.imgur.com/FbE0s.jpg"/>
</div>
</div>
CSS:
.aside-block__content {
width:314px;
height:115px;
background-image: url(http://i.stack.imgur.com/msmci.jpg);
}
.aside-block__content a{
float:right;
margin:50px 30px 0 0;
}

Answer 3

There are a couple of ways to do this.
You could do this by...
HTML:
<div id="wrapper"> <!-- wrapper with the background - image -->
<div id="social_media"> <!-- a container for the social media icons -->
<img class="icon" src="/media/19133/Twetter.jpg"/> <!-- Your Icons -->
<img class="icon" src="/media/19133/facebok.jpg"/>
<img class="icon" src="/media/19133/insta.jpg"/>
</div>
</div>
Css:
#wrapper { background: url(/media/19134/001.jpg) no-repeat; }
#social_media { /* Your positioning */ }
.icon { float:right; margin-left: 20px; }