Problema di visualizzazione su Firefox/Opera

**cripo** · 16-06-2011, 10:29

Salve a tutti,
non riesco in nessun modo a far scomparire lo spazio sopra i bordi del menu della mia pagina che compare utilizzando Firefox/Opera.
Tanto per cambiare su IE non ci sono problemi ma su FF e Opera si.
Questo comportamento mi è apparso non appena sono passato ad XHTML 1.0 / 1.1 (ora è 1.1).
Qualche anima pia potrebbe aiutarmi? Ho cercato in tutti i modi di utilizzare un clearfix pensando potesse essere quello il problema, ma purtroppo non lo è.

Vi posto HTML e CSS. La pagina di esempi la trovate su www.chrisoft.net/ovunquecasa
Grazie a tutti

HTML:

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml" lang="it" xml:lang="it">

	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1" />
		<title>
			Immobiliare Giampà di Caterina Giampà
		</title>
		<style type="text/css">
			@import url("css/stile.css");
		</style>
	</head>
	<body>
		<div id="container" class="clearfix">
			<div id="header">
				<div id="logo-sx">
					[img]images/immobiliare-giampa-logo.jpg[/img]
				</div>
				<div id="centro">
				</div>
				<div id="logo-dx">
					[img]images/immobiliare-giampa-logo-dx-up.jpg[/img]

					<a href="http://www.ovunquecasa.it">
						[img]images/immobiliare-giampa-logo-dx-down.jpg[/img]
					</a>
				</div>
			</div>
			<div id="menu" class="clearfix">
				<div class="clearfix">
					home
					vendita
					affitto
					servizi
					chi siamo
					contatti
				</div>
			</div>
			<div id="foto"></div>
			<div id="corpo">
				<div class="riga-vetrina">
					<div class="annuncio">
						<div class="annuncio_titolo">
							Roma - Aurelio
						</div>
						<div class="annuncio_corpo">
							<div class="annuncio_corpo_testo">
								Casa di diverse stanze con immagini bellissime che si vedono dalle finestre. Scorci di tramonti notturni. mldksmflòdfmlòdmòlfjdv sVNKnvkldnSKVò vv78
							</div>
							<div class="annuncio_corpo_prezzo">
								prezzo: € 20.000
							</div>
						</div>
						<div class="annuncio_tipo">
							AFFITTASI
						</div>
						<div class="annuncio_foto">
							[img]images/esempio.jpg[/img]
						</div>						
					</div>
					
					<div class="annuncio">
						<div class="annuncio_titolo">
							Roma - Laurentino
						</div>
						<div class="annuncio_corpo">
							<div class="annuncio_corpo_testo">
								Casa di diverse stanze con immagini bellissime che si vedono dalle finestre. Scorci di tramonti notturni. mldksmflòdfmlòdmòlfjdv sVNKnvkldnSKVò vv78
							</div>
							<div class="annuncio_corpo_prezzo">
								prezzo: € 20.000
							</div>
						</div>
						<div class="annuncio_tipo">
							VENDESI
						</div>
						<div class="annuncio_foto">
						</div>						
					</div>

					<div class="annuncio">
						<div class="annuncio_titolo">
							Santa Marinella (RM)
						</div>
						<div class="annuncio_corpo">
							<div class="annuncio_corpo_testo">
								Casa di diverse stanze con immagini bellissime che si vedono dalle finestre. Scorci di tramonti notturni. mldksmflòdfmlòdmòlfjdv sVNKnvkldnSKVò vv78
							</div>
							<div class="annuncio_corpo_prezzo">
								prezzo: € 20.000
							</div>							
						</div>
						<div class="annuncio_tipo">
							VENDESI
						</div>
						<div class="annuncio_foto">
						</div>						
					</div>

					<div class="annuncio">
						<div class="annuncio_titolo">
							Roma - Medaglie d'Oro
						</div>
						<div class="annuncio_corpo">
							<div class="annuncio_corpo_testo">
								Casa di diverse stanze con immagini bellissime che si vedono dalle finestre. Scorci di tramonti notturni. mldksmflòdfmlòdmòlfjdv sVNKnvkldnSKVò vv78
							</div>
							<div class="annuncio_corpo_prezzo">
								prezzo: € 20.000
							</div>							
						</div>
						<div class="annuncio_tipo">
							VENDESI
						</div>
						<div class="annuncio_foto">
						</div>						
					</div>
				</div>
			</div>
			<div id="footer">
				immobiliare GIAMP&Agrave; di Caterina Giampà - Via Aurelia, 104 00165 ROMA (RM) tel.: 066631615
			</div>
		</div>
	</body>
</html>

Css:

codice:

@import url(reset.css);

body {	font-size: 10px;
 	font-family: arial;
	margin: 10px 0 0 0;
	padding:0}
				
div {	margin:0;
 	padding:0;}

div#container {	width: 1000px;
 		height: 100%;
 		position: relative;
 		left: 50%;
 		margin-left: -500px;}

div#header 	{width: 100%;
 		  height:130px;
 		 display:block;}

div#logo-sx {	width: 200px !important;
 		width: 210px;
 		height: 100%;
 		float: left;
 		padding: 5px 0 0 10px;}
 							
div#centro  {	width: 680px;
  		height: 100%;
 		float: left;}
 							
div#logo-dx {	width: 110px;
 		height: 100%;
 		float: left;
		padding: 5px 0 0 0;}

div#menu {	width:100%;
 		text-align:center;
 		height:35px;
 		background:  #333333 url('../images/immobiliare-giampa-bg-menu.jpg') no-repeat;}
 					
div#menu div {	height:inherit;
 		border-width:0 0 0 1px;
 		border-style: solid;
 		border-color: #555555;
		overflow:visible;
		width:608px;
		padding:0;
 		margin: 0 auto}
 								
div#menu a {	float:left;
		width:100px;
		height: inherit;
		border-width: 0 1px 0 0;
		border-style: solid;
		border-color: #555555;
		height:25px !important;
 		height:35px;
 		font-size:1.2em;
		border-width: 0 1px 0 0;
		border-style: solid;
		border-color: #555555;
		font-family:arial;
		text-transform:lowercase;
		text-decoration:none;
		color:#ffffff;
		padding-top:12px;
		margin:0;}
							
div#menu a:hover {	background-color: #ff0100;}

div#menu a#home {	border-width: 0 1px ;
									border-style: solid;
									border-color: #555555;}

div#foto {	width:100%;
 						height:235px;
 						background:  #333333 url('../images/immobiliare-giampa-1.jpg') no-repeat}
 						
div#corpo {	width:100%;
 		min-height: 500px;
 		height:500px;
 		background-color: #E9E9EB;}
 						
div#footer {	width:100%;
 		min-height: 30px;
 		height: 30px !important;
 		height:50px; 
		background-color: #191919;
		border-width:10px 0 0 0;
 		border-style: solid;
 		border-color: #444444;
		color: #FFFFFF;
 		font-weight: normal;
 		font-size: 1.1em;
 		text-align: center;
 		padding:15px 0 0 0;}
 							
div.riga-vetrina {	width: 100%;
 		display:table-row;
		padding:10px 0 10px 0;}
										
div.annuncio{	width:250px;
 		padding:0 10px 0 10px;
 		float:left;
 		color: #ffffff;
 		text-align: center;
 		display:table-row;}
 							
div.annuncio_titolo{width:100%;
		 background-color: #8D8D8D;
 		 height:25px !important;
  		 height: 30px;
 		 padding: 8px 0 0 0;
		 font-size: 1.2em;}
											
div.annuncio_corpo{width:100%;
 		 height:130px;
 		 background-color: #dadadf;}
 										
div.annuncio_corpo_testo{	width:100%;
 			height:100px;
 			overflow: hidden;
 			font-size: 1.2em;
			text-align:justify;
 			color: #000000;
			line-height:1.4em;
			padding: 5px 5px 0 5px;}
													
div.annuncio_corpo_prezzo{	width:100%;
 			height: 30px;
			padding:6px 0 6px 0;
 			color: #ff0000;
 			font-weight: bold;
 			font-size: 1.2em;
			text-align: left;}
														
div.annuncio_tipo{	width:100%;
	             background-color: #8D8D8D;
 		height:20px !important;
 		height:30px;
 		padding: 7px 0 0 0;
		font-size: 1.2em;
		font-family: arial;
		font-weight: normal;}
										
div.annuncio_foto{	width:100%;
 		height:150px;
 		background-color: black;
 		font-size: 0;}
 										
html>body .annuncio {	width:230px;
			padding:10px}
											
html>body .annuncio_corpo{	width:100%;
 			padding:0;}
 														
html>body .annuncio_corpo_testo {	width:96%;							padding:0 5px;}
 																	
html>body .annuncio_corpo_prezzo {	width:96%;
 				padding:0 5px;}
 																		
html>body .menu_bottone {float: none;}

html>body div#menu {padding-top:0;}



/* For modern browsers */
.clearfix:before,
.cf:after {
    content:"";
    display:table;
}

.clearfix:after {
    clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.clearfix {
    zoom:1;
}

Css reset.css:

codice:

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

Discussione: Problema di visualizzazione su Firefox/Opera

Strumenti discussione

Ricerca discussione

Visualizza

Hybrid View

Problema di visualizzazione su Firefox/Opera

Permessi di invio