botón se desplaza sobre capa

[xtuu]

Buenas compis, tengo una duda que no consigo resolver...
La cosa es que tengo una capa en la cual hay botones, al aumentar la ventana (ctrl +) digamos que el botón se desplaza...
Pensaba que con (position: fixed;) se solucionaría pero no , y he probado ya varias formas y no tengo ni idea... A ver si vosotros podéis saber el porqué los botones se desplazan...
Gracias de antemano

Codigo de la capa

contenido{
margin-top:0%;
margin-bottom:0%;
margin-left:0%;
margin-right:0%;
width: 100%;
height: 500px;
background:#E96500;
-webkit-border-radius:10px;
-moz-border-radius:10px;
-o-border-radius:10px;
border-radius:10px;
position:relative;
}

Código del botón

.boton{
background-color: #2dc234;
background-image: -webkit-linear-gradient(rgba(41, 150, 47, .8), rgba(45, 194, 52, .2));
background-image: -moz-linear-gradient(rgba(41, 150, 47, .8), rgba(45, 194, 52, .2));
background-image: -o-linear-gradient(rgba(41, 150, 47, .8), rgba(45, 194, 52, .2));
background-image: linear-gradient(rgba(41, 150, 47, .8), rgba(45, 194, 52, .2));
-ms-border-radius:8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: 0 8px 0 #197b1d, 0 10px 20px rgba(0, 0, 0, .4);
-moz-box-shadow: 0 8px 0 #197b1d, 0 10px 20px rgba(0, 0, 0, .4);
box-shadow: 0 8px 0 #197b1d, 0 10px 20px rgba(0, 0, 0, .4);
color: #FFFFFF;
font-family: 'Pacifico', Arial, sans-serif;
font-size: 20px;
line-height: 1;
padding: 15px 25px;
margin-left:20%;
margin-bottom:0px;
margin-top:5%;
margin-right:0px;
width:10%;
height:5%;
text-decoration: none;
text-shadow: 0 -1px 1px rgba(25, 123, 29, .7);
position:fixed;
}