Witma, mam stronę startową, a na na niej tło i jeden obrazek działający na zasadzie <a href. Udało mi się, żeby tło się nie skalowało i było na cały monitor. Na każdym komputerze i przeglądarce działa. Zrobiłem to tak:
body{
background-image: url(../grafika/background_strona_glowna.png);
background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-position: center top;
display: block;
min-height: 100%;
width: 100%;
height: 100%;
overflow: auto;
margin-left: auto;
margin-right: auto;
background-repeat: no-repeat;
background-attachment: fixed;
margin: 0 auto;
position: relative;
}
W index.html znajduje się jedynie jeden div i jeden img, zmieniający się w zależności od pozycji myszki, a wygląda to tak:
<body>
<div id="przycisk">
<a href="home_page.php" onMouseOver="go.src='grafika/Go_button2.png'" onMouseOut="go.src='grafika/GO_button.png'">
<img src="grafika/GO_button.png" name="go" width="146px" height="60px">
</a>
</div>
</body>
Nie mam pojęcia jak mam zrobić aby ten img na każdej stronie i przeglądarce był w tym samym miejscu, niezależnie od rozdzielczości monitora. Chce aby był on na środku (w poziomie) i w pionie około margines górny około 60% przeglądarki okna.
Na ten moment wygląda to tak:(nie działa, tak jak chcę)
#przycisk{
width: 100%;
height: 100%;
margin-left: auto;
margin-right: auto;
position: absolute;
margin: auto;
margin-top: 25%; // mam 25%, bo kiedy jest 60%, to znika i po prawej stronie pojawia się pasek do przewijania
#przycisk:hover{
cursor: pointer;
}
