30-03-2009, 00:42
Witam. Moim problemem jest różna interpretacja wyświetlania poszczególnych obrazków w przeglądarkach...
Główny obrazek tła mam na center, a resztę mam dopasowaną "ręcznie". Czy istnieje prostszy sposób, dzięki któremu każda przeglądarka będzie tak samo interpretowała położenie obrazków.
I HTML:
Główny obrazek tła mam na center, a resztę mam dopasowaną "ręcznie". Czy istnieje prostszy sposób, dzięki któremu każda przeglądarka będzie tak samo interpretowała położenie obrazków.
Kod:
body {
background-color: #7d964b;
background-image: url(images/tlo.png);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
width: 734px;
height: 742px;
margin: 0;
padding: 0;
border: 0px;
}
#logo{
background: url(images/logo.png) no-repeat;
background-attachment: absolute;
background-position: center;
position: absolute;
width: 734px;
height: 207px;
left: 263px;
bottom: 575px;
margin: 0;
padding: 0;
border: 0px;
z-index: 2;
}
#home {
background-image: url(images/home.png);
background-repeat: no-repeat;
width: 75px;
height: 35px;
position: fixed;
left: 270px;
top: 74px;
margin: 0;
padding: 0;
border: 0px;
z-index: 4;
}
#home:hover {
background-image: url(images/homeh.png);
background-repeat: no-repeat;
width: 75px;
height: 35px;
position: fixed;
left: 270px;
top: 74px;
margin: 0;
padding: 0;
border: 0px;
z-index: 4;
}
#onas {
background-image: url(images/onas.png);
background-repeat: no-repeat;
width: 77px;
height: 32px;
position: fixed;
left: 270px;
top: 240px;
margin: 0;
padding: 0;
border: 0px;
z-index: 4;
}
#onas:hover {
background-image: url(images/onash.png);
background-repeat: no-repeat;
width: 77px;
height: 32px;
position: fixed;
left: 270px;
top: 240px;
margin: 0;
padding: 0;
border: 0px;
z-index: 4;
}
#oferta {
background-image: url(images/oferta.png);
background-repeat: no-repeat;
width: 106px;
height: 32px;
position: fixed;
left: 445px;
top: 240px;
margin: 0;
padding: 0;
border: 0px;
z-index: 4;
}
#oferta:hover {
background-image: url(images/ofertah.png);
background-repeat: no-repeat;
width: 106px;
height: 32px;
position: fixed;
left: 445px;
top: 240px;
margin: 0;
padding: 0;
border: 0px;
z-index: 34;
}
#galeria {
background-image: url(images/galeria.png);
background-repeat: no-repeat;
width: 122px;
height: 28px;
position: fixed;
left: 640px;
top: 240px;
margin: 0;
padding: 0;
border: 0px;
z-index: 4;
}
#galeria:hover {
background-image: url(images/galeriah.png);
background-repeat: no-repeat;
width: 122px;
height: 28px;
position: fixed;
left: 640px;
top: 242px;
margin: 0;
padding: 0;
border: 0px;
z-index: 4;
}
#kontakt {
background-image: url(images/kontakt.png);
background-repeat: no-repeat;
width: 133px;
height: 35px;
position: fixed;
left: 855px;
top: 236px;
margin: 0;
padding: 0;
border: 0px;
z-index: 4;
}
#kontakt:hover {
background-image: url(images/kontakth.png);
background-repeat: no-repeat;
width: 133px;
height: 35px;
position: fixed;
left: 855px;
top: 236px;
margin: 0;
padding: 0;
border: 0px;
z-index: 4;
}I HTML:
Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//PL">
<html lang="pl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-2"/>
<title>Hellerówka - piękne ogrody w Bydgoszczy zapraszaj±</title>
<meta name="Description" content="Piękne ogrody w Bydgoszczy, które zachwycą cie swoim pięknem.Projektujemy i doradzamy." />
<meta name="Keywords" content="ogrody projektowanie,ogrody Bydgoszcz,projektowanie ogrodów,projektowanie ogrodu,Bożena Heller,Krzysztof Heller,ogrodnictwo,piękne ogrody,byliny,zioła,krzewy" />
<meta name="Author" content="Emilia Heller"/>
<link rel="shortcut icon" href="http://www.hellerowka.pl/images/favicon.ico" />
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<div id="logo">
</div>
<div id="home">
</div>
<div id="onas">
</div>
<div id="oferta">
</div>
<div id="galeria">
</div>
<div id="kontakt">
</div>
</body>
</html>
