no nech sa paci :
Kód:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<!-- Mirrored from www.edasalon.sk//design/ by HTTrack Website Copier/3.x [XR&CO'2007], Wed, 24 Sep 2008 19:47:57 GMT -->
<head>
<link href="style.css" rel="stylesheet" type="text/css" >
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250" >
<meta name="keywords" content="edasalon" >
<meta name="description" content="EDA Salon Edita Urbanova kadernictvo, kozmetika" >
<meta name="author" content="Švolo - Martin Švolík; dedko45" >
<meta name="robots" content="all, follow" >
<meta content="sk" http-equiv="content-language" >
<meta http-equiv="Content-Script-Type" content="text/javascript" >
<meta http-equiv="Content-Style-Type" content="text/css" >
<meta http-equiv="refresh" content="3">
<link rel="shortcut icon" href="http://www.edasalon.sk//design/favicon.ico">
<title>EDA Salón - Edita Urbanová | Vitajte</title>
<!--[if lt IE 7]>
<script defer type="text/javascript" src="pngfix.js"></script>
<![endif]-->
<!--[if IE]>
<link rel="stylesheet" href="fix.css" type="text/css" />
<![endif]-->
</head>
<body>
<div id="center">
<div id="header">
<ul id="menu">
<li><a class="home" href="index9ba3.html?page=home"></a> </li>
<li><a class="galery" href="index9ba3.html?page=home"></a> </li>
<li><a class="hair" href="index9ba3.html?page=home"></a> </li>
<li><a class="cennik" href="index9ba3.html?page=home"></a> </li>
<li><a class="mapa" href="index9ba3.html?page=home"></a> </li>
<li><a class="kontakt" href="index9ba3.html?page=home"></a> </li>
</ul>
<a href="#" id="logo"><img src="./logo.png" /></a>
</div>
<div id="wrap">
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean et est a dui semper facilisis. Pellentesque placerat elit a nunc. Nullam tortor odio, rutrum quis, egestas ut, posuere sed, felis. Vestibulum placerat feugiat nisl. Suspendisse lacinia, odio non feugiat vestibulum, sem erat blandit metus, ac nonummy magna odio pharetra felis. Vivamus vehicula velit non metus faucibus auctor. Nam sed augue. Donec orci. Cras eget diam et dolor dapibus llicitudin. In lacinia, tellus vitae laoreet ultrices, lectus ligula dictum dui, eget condimentum velit dui vitae ante. Nulla nonummy augue nec pede. Pellentesque ut nulla. Donec at libero. Pellentesque at nisl ac nisi fermentum viverra. Praesent odio. Phasellus tincidunt diam ut ipsum. Donec eget est.
</p>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean et est a dui semper facilisis. Pellentesque placerat elit a nunc. Nullam tortor odio, rutrum quis, egestas ut, posuere sed, felis. Vestibulum placerat feugiat nisl. Suspendisse lacinia, odio non feugiat vestibulum, sem erat blandit metus, ac nonummy magna odio pharetra felis. Vivamus vehicula velit non metus faucibus auctor. Nam sed augue. Donec orci. Cras eget diam et dolor dapibus llicitudin. In lacinia, tellus vitae laoreet ultrices, lectus ligula dictum dui, eget condimentum velit dui vitae ante. Nulla nonummy augue nec pede. Pellentesque ut nulla. Donec at libero. Pellentesque at nisl ac nisi fermentum viverra. Praesent odio. Phasellus tincidunt diam ut ipsum. Donec eget est.
</p>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean et est a dui semper facilisis. Pellentesque placerat elit a nunc. Nullam tortor odio, rutrum quis, egestas ut, posuere sed, felis. Vestibulum placerat feugiat nisl. Suspendisse lacinia, odio non feugiat vestibulum, sem erat blandit metus, ac nonummy magna odio pharetra felis. Vivamus vehicula velit non metus faucibus auctor. Nam sed augue. Donec orci. Cras eget diam et dolor dapibus llicitudin. In lacinia, tellus vitae laoreet ultrices, lectus ligula dictum dui, eget condimentum velit dui vitae ante. Nulla nonummy augue nec pede. Pellentesque ut nulla. Donec at libero. Pellentesque at nisl ac nisi fermentum viverra. Praesent odio. Phasellus tincidunt diam ut ipsum. Donec eget est.
</p>
</div>
<div id="footer">
</div>
</div>
</html>
CSS :
Kód:
html{margin:0px;padding:0px;}
body{background: #ff9833 url(./img/pas.png) repeat-x;text-align:center;margin:0 auto;}
img{border:none;margin:0px;padding:0px;}
div#center{position:relative;text-align:center;margin:0 auto;width:830px;height:100%;}
div#header{background: transparent url(./img/head.png) no-repeat;width:830px;height:276px;margin-top:70px;}
div#wrap{background: transparent url(./img/obsah.png) repeat-y;width:830px;height:auto;text-align:left;}
p{margin:0px;padding:10px;}
div#footer{background:transparent url(./img/pata.png) no-repeat;width:830px;height:96px;}
a#logo{float:left;margin:0px;margin-left:10px;}
a#logo img{margin:0px;padding:0px;}
ul#menu {position:relative; width:782px;margin:0px;padding:0px;padding-left:19px; list-style-type:none;padding-top:30px;}
ul#menu a:hover
{opacity: 0.7; -moz-opacity: 0,7; }
.home {width:149px; height:51px; background: url('img/home.png') no-repeat; display:block; float:left }
.galery {width:119px; height:51px; background: url('img/galery.png') no-repeat; display:block; float:left }
.hair {width:118px; height:51px; background: url('img/hair.png') no-repeat; display:block; float:left }
.cennik {width:119px; height:51px; background: url('img/cennik.png') no-repeat; display:block; float:left }
.mapa {width:126px; height:51px; background: url('img/mapa.png') no-repeat; display:block; float:left }
.kontakt {width:151px; height:51px; background: url('img/kontakt.png') no-repeat; display:block; float:left }
fix
Kód:
/*FIX PRE IE7*/
#header a img {margin-top:-50px;position:relative;}
#header ul{margin-left:0px;margin-top:0px;width:810px;height:51px;float:left;}
#header ul a.home {width:149px; height:51px; background: url('img/home.png') no-repeat; display:block;margin-top:0px; }
#header ul a.galery {width:119px; height:51px; background: url('img/galery.png') no-repeat; display:block;margin-top:-19px;}
#header ul a.hair {width:118px; height:51px; background: url('img/hair.png') no-repeat; display:block;margin-top:-38px; }
#header ul a.cennik {width:119px; height:51px; background: url('img/cennik.png') no-repeat; display:block;margin-top:-57px;margin-left:385px;}
#header ul a.mapa {width:126px; height:51px; background: url('img/mapa.png') no-repeat; display:block;float:right;margin-top:-76px;margin-right: 160px;}
#header ul a.kontakt {width:151px; height:51px; background: url('img/kontakt.png') no-repeat; display:block;float:right;margin-top:-95px;margin-right: 10px;}
V IE 6 som to nepozeral bude to tam urcite rozhadzana na 100% tam si to uprav, pretoze ten fix na IE nie je dobre rieseny a aj menu by sa malo inak riesit kazdopadne v FF, OPERE, IE 7 ide ako ma...

(ja som cerveny zlty je IE)