C'era un pò di codice css ridondante. Inoltre ho pensato bene di aggiungere un div main che contenesse i div navigation e content, così è più ordinato. Ho testato il tutto con Firefox 3.5, Explorer 8 e Chrome. Occhio ai bordi tratteggiati dell'header: con Explorer 7/8 li vedrai un pò diversi. Per il resto dovrebbe andare.
HTML
codice:
<body>
<div id="container">
<div id="header">
<div id="menuo">
<ul>
[*]Chi Siamo
[*]Dove Siamo
[*]Lo Staff
[*]Contatti[/list]
</div>
<h1>COOKINGHOME</h1>
</div>
<div id="main">
<div id="navigation">
<div id="menuv">
<ul>[*]CookingHome[*]La Scuola[*]I Menu[*]Gallery[*]Partners[/list]
</div>
<div id="gallery">
<div id="slider">
<ul id="sliderContent">
<li class="sliderImage">
[img]images/410/1.jpg[/img]
<span class="top">Title text 1
Content text...</span>
<li class="sliderImage">
[img]images/410/2.jpg[/img]
<span class="top">Title text 2
Content text...Content text...Content text...Content text...Content text...Content text...Content text...Content text...Content text...Content text...Content text...</span>
<li class="sliderImage">
[img]images/410/3.jpg[/img]
<span class="bottom">Title text 2
Content text...</span>
<li class="sliderImage">
[img]images/410/4.jpg[/img]
<span class="bottom">Title text 2
Content text...</span>
<li class="sliderImage">
[img]images/410/5.jpg[/img]
<span class="top">Title text 2
Content text...</span>
<div class="clear sliderImage"></div>[/list]
</div>
</div>
</div>
<div id="content">
Se gli archivi sumerici e babilonesi consentono di farci un quadro di massima dell'alimentazione delle popolazioni mesopotamiche, non molto sappiamo, invece, dei loro gusti e delle loro tecniche di cucina. È nota la loro avversione per la carne suina (condivisa dagli Egizi) e la loro predilezione per la carne ovina: l'una e l'altra saranno ereditate dagli Ebrei e dagli Arabi. Una varietà di pecora di cui, a detta di Erodoto, andavano particolarmente ghiotte era quella «dalla coda grassa», un'appendice, pregiatissima, che poteva toccare i cinque chilogrammi di peso.
La lievitazione del pane fu scoperta in Egitto. Anche se si continuò a lungo a far uso di pane azimo, le caste superiori potevano scegliere fra un quarantina di tipi di pane lievitato e di dolci a base di uova, latte e miele. Erodoto ci informa che le medesime caste prediligevano i volatili (anatre, piccioni, quaglie, coturnici, gazze).
Gli uccelli più piccoli, oltre che stufati, si gustavano crudi in salamoia. I canali e le paludi del Nilo erano ricchi di anguille, carpe, muggini e pesci persici, che si consumavano anche salati ed essiccati.
La cucina greca è sufficientemente documentata. Le carni preferite erano quelle del maiale, della lepre e degli uccelli. La selvaggina da pelo veniva prima lessata, poi arrostita allo spiedo e infine accompagnata da salse «dolci e grasse». Erano molto apprezzati anche le frattaglie e i sanguinacci (ne era attribuita la creazione al cuoco Aftonita).
</div>
<div id="logo">
[img]images/website/logox.png[/img]
</div>
</div>
<div id="footer"></div>
</div>
</body>
</html>
CSS
codice:
html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, img, ul, li {
margin:0;
padding:0;
border:0;
}
table {
border-collapse:separate;
border-spacing:0;
}
a img {border:none;}
body {
background-image: url("../images/website/sfondo.png");
line-height:1.5;
}
div#container {
margin:0 auto;
width:1200px;
background-image: url("../images/website/sfondo.png");
}
#header {
width:1200px;
height:100px;
background: url("../images/website/header.png") no-repeat;
border: dashed;
}
div#header h1 {
padding:10px 0 0 10px;
font-family: algerian;
font-weight:normal;
font-size:72px;
color:#f5f5f5;
}
div#menuo {
margin:70px 0 0 25px;
width:400px;
border-color:white;
float:right;
}
div#menuo ul {
list-style:none;
}
div#menuo li {
margin:0 0 10px 0;
padding:0 10px 0 0;
color: #f5f5f5;
display:inline;
text-align:right;
font-size: 20px;
}
div#menuo li:hover {color: #d2b48c;}
#main {
height: 700px;
}
#navigation {
margin:30px 0 0 0;
float:left;
background-color:transparent;
}
div#menuv{
margin: 10px 40px 10px 40px;
width:280px;
border: double;
}
div#menuv ul {
margin:0 auto;
list-style:none;
background-color: transparent;
}
div#menuv li {
margin:0 0 10px 0;
background-image: url('../images/website/menu.png');
color: #f5f5f5;
height:50px;
width:280px;
text-align:center;
font-size: 36px;
}
div#menuv li:hover {color: #d2b48c;}
#content {
margin:15px 0 0 0;
float:right;
padding:0;
width:800px;
height:510px;
overflow: auto;
font-size:80%;
}
div#gallery {
margin:15px 0 15px 0;
width:360px;
float:left;
border: double;
}
div#logo {
float:right;
width:200px;
height:150px;
border: 1px solid #000;
}
#footer {
width:1200px;
height:50px;
background:transparent url("../images/website/footer.png") no-repeat;
border: dotted;
}
li {
cursor: pointer;
}