How to make image buttons stay in place when re-sizing web browser

Question

This is my image-button for my website. http://puu.sh/cK7Sf/6309c39cdb.jpg When I re-size my browser it goes over here http://puu.sh/cK7VU/f17dafcc41.jpg

Here is my code

HTML

<div class="Nav">
        <div id="buttons">
            <a href="/"><div id="home_button"></div></a>

CSS

#home_button {
background-image: url("home.png");
background-repeat:no-repeat;
background-size: 100%;
width: 150px;
height: 60px;
position: absolute;
top: 196px;
left: 502px;
z-index: 10;
}

Answer 1

#buttons div need to have a position: relative; set for abosolut position to vork as you want.

Answer 2

您将要删除“ position：absolute; ”并使用“ float：left;”