So i'm making a webpage...

view here... www.girlzwithmoustaches.com/home2

I have a top social media icon banner which i made inside of a "header"... 

The css is below.. Now i want the top banner to match the width % of the image below... So when the user resizes the window, or based upon their browser window size, the top banner of the social media icons will stay aligned with the right most portion of the image slideshow below it..

please help. how can i do this.. The social media icons are a basic ul with li and 

```
 #headerwhat {
position: absolute;
top: 30px;
left:100px;
width: 70%;
height: auto;
vertical-align: middle;
horizontal-align: middle;

}

.smbanner {
width: 200px;
height: 50px;
position: relative;
float:right;
top: 0px;
left: 0px;

}

.smicons {
display: inline-block;
padding: 3px;
}

```