JSFiddle - React, Tailwind, and code Playground
HTML
<div class="header">
<div class="logo"></div>
<div class="social"> <a href="http://www.facebook.com" target="_blank"><img class="socialBtn" src="http://i973.photobucket.com/albums/ae213/GeminiJuSa/facebook_btn.png" border="0" /></a>
<a href="http://www.twitter.com" target="_blank"><img class="socialBtn" src="http://i973.photobucket.com/albums/ae213/GeminiJuSa/facebook_btn.png" /></a>
<a href="http://www.pinterest.com" target="_blank"><img class="socialBtn" src="http://i973.photobucket.com/albums/ae213/GeminiJuSa/facebook_btn.png" /></a>
</div>
</div>
CSS
.header {
width: 650px;
height: 150px;
clear: left;
margin: 0px auto;
background-color: #efefef;
position: relative;
border-radius: 4em 4em 0 0;
}
.social{
padding: 1em 2em 0 0;
display: inline-block;
position: absolute;
right: 0;
}
.socialBtn{
height: 2.5em;
width: 2.5em;
}
img {
display: block;
}
a {
display: inline-block;
background-color: orange;
outline: 0; /* removes dotted border */
}