To dziwne? Chyba wina tego, że wszystko jest na "position: absolute". Nie polecam tego sposobu. Spróbuję zakodować od nowa całą stronkę.
Oto kod css: ( daj go w odrębnym pliku style.css )
A to plik html:
Działa w każdej przeglądarce.
Oto kod css: ( daj go w odrębnym pliku style.css )
Kod:
/* Styl CSS */
body {
background-image: url('grafika/tlo.gif');
}
#pege {
width: 800px;
margin: auto;
}
#header {
float: left;
width: 800px;
}
#logo {
background-image: url('grafika/logo.gif');
width: 144px;
height: 46px;
float: left;
margin: 10px;
margin-top: 50px;
}
#naglowek {
background-image: url('grafika/naglowek.gif');
width: 565px;
height: 105px;
float: left;
margin: 10px;
margin-top: 20px;
}
h1 {
display: block;
text-align: center;
border-bottom-style: inset;
border-bottom: thick double;
padding-bottom: 8px;
}
#menu {
width: 200px;
float: left;
}
ul, ul li {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
ul li {
width: 190px;
padding-left: 10px;
background: #797 url("grafika/punkt.gif") no-repeat left top;
border-width: 1px;
border-style: solid;
border-color: #dfe #365 #365 #dfe;
}
ul a:link, ul a:visited {
display: block;
width: 169px;
text-decoration: none;
padding: 5px 10px;
font-weight: bold;
background: #bfb url("galeria/tlo1.gif") repeat-x top;
color: #365;
border-left: 1px solid #797;
}
ul a:hover {
background-color: #797;
background-image: url("galeria/tlo2.gif");
color: #eff;
}
#content {
width: 500px;
float: left;
padding: 10px;
text-align: center;
border-bottom-style: inset;
border-bottom: thick double;
padding-bottom: 50px;
margin-left: 20px;
}
#zdjecia {
background: url('grafika/pantofle.gif');
width: 720px;
height: 180px;
float: left;
margin-left: 20px;
margin-top: 30px;
}A to plik html:
Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="Mateusz Maciaszek" />
<meta http-equiv="reply-to" content="[email protected]" />
<meta name="description" content="Pantofle" />
<meta name="keywords" content="pantofle, klapki, trepy, sanday, pantofle regionalne, gralskie, pantofle gralskie, sanday, pantofle skrzane, skry owcze, skry baranie " />
<meta http-equiv="content-language" content="pl" />
<!-- Roboty -->
<meta name="robots" content="ALL" />
<meta name="distribution" content="GLOBAL" />
<title>Pantofle, pantofle skrzane, pantofle gralskie, pantofle regionalne, klapki, kapcie Jerzy Maciaszek</title>
<!-- Szablony -->
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<div id="pege">
<div id="header">
<div id="logo"></div>
<div id="naglowek"></div>
<h1><strong>PANTOFLE</strong></h1>
</div>
<div id="menu">
<ul>
<li><a href="index.htm" id="current">Strona Główna</a></li>
<li><a href="pantofle galeria.html">Galeria</a></li>
<li><a href="pantofle o nas.html">O nas</a></li>
<li><a href="pantofle dojazd.html">Dojazd</a></li>
<li><a href="pantofle kontakt.htm">Kontakt</a></li>
</ul>
</div>
<div id="content">
PRZYJMĘ ZLECONĄ PRODUKCJĘ<br />
JEŻELI SZUKASZ WYKONAWCY LUB PODWYKONAWCY W NASZEJ<br />
GAŁĘZI PRZEMYSŁU, ZAPRASZAM DO WSPÓŁPRACY.<br />
JEŻELI BĘDZIEMY W STANIE TECHNICZNYM<br />
WYKONAĆ TWOJE ZLECENIE,<br />
NA PEWNO BĘDZIESZ ZADOWOLONY<br />
</div>
<div id="zdjecia"></div>
</div>Działa w każdej przeglądarce.
