Problemi tra firefox e IE con margin e altro

mrlink

Problemi tra firefox e IE con margin e altro

Ciao a tutti, sto completando la grafica di un template per wordpress ma ho due problemi: uno si verifica solo con firefox e l'altro solo con Internet Explorer (l'ultima versione).

Problema uno: In firefox si vede uno psazio bianco appena sotto l'header e non capisco da dove venga... ecco l'immagine

[URL=http://imageshack.us]

Questo è il relativo codice css dell'header: >
#page { background: #fff; border: none; } <?php } ?>
#header { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickheader.png") no-repeat top center; }
#footer { background: repeat-y bottom; border-left:double #CCCCCC; width: 800px; position:relative; left:50%; margin: 0 0 0 -403px;}

In IE si vede uno strano bordo grigio a sx solo per quanto riguarda il footerr.

Immagine:
[URL=http://imageshack.us]

Codice css relativo al footer: > { background:; border: none; } <?php } ?>
{ background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickheader.png") no-repeat top center; }
{ background: repeat-y bottom; border-left:double; width: 800px; position:relative; left:50%; margin: 0 0 0 -403px;}

e > { background: repeat-y bottom; border-left:double; width: 800px; position:relative; left:50%; margin: 0 0 0 -403px;}

:?:?:?

Vi prego rispondetemi perchè è urgentissimo! Grazie 1000!

laburno

Ciao Mrlink.
Lo spazio bianco può essere generato da un sacco di cose: elementi interni, o adiacenti per esempio. Che c'è in quelle zone?

Riguardo al footer e al bordo grigio, è palesemente dichiarato nel CSS:
border-left:double #CCCCCC;

mrlink

Intanto grazie perchè ora il footer e a posto! Per quanto riguarda la barra bianca non so.. sotto c'è una sidebar forse è quello il problema.. ti posto il relativo codice css:

#subnavup {
background: #F2F2F2;
width:800px;
height:28px;
font-size:11px;
border-bottom:1px solid #CCC;

}

ul#subnav li {
float: left;
list-style-type:none;
line-height:28px;
}
ul#subnav1 li {
float: left;
list-style-type:none;
line-height:28px;
color:#999;
}
ul#subnav1 a:hover {
float: left;
list-style-type:none;
color:#999;
}

ul#subnav1 a {
float: left;
text-decoration:none;
color:#999;
font-weight: bold;
}
ul#subnav li.special {
float:right;
}

ul#subnav1 li.selected {
background-image: url("<?php bloginfo('stylesheet_directory'); ?>/images/selected.gif");
background-repeat: no-repeat;
background-position:bottom center;
float: left;
text-decoration:none;
color:#999;
margin-right:5px;
font-weight: bold;
}

ul#subnav a {
float: left;
text-decoration:none;
color:#111111;
padding: 0px 5px;
font-weight: bold;
}

ul#subnav a:hover {
background-color:#C0C0C0;
color:#ffffff;
}

ul#subnav selected:hover {
background-image: url("<?php bloginfo('stylesheet_directory'); ?>/images/selected.gif");
background-repeat: no-repeat;
background-position:bottom center;
float: left;
text-decoration:none;
color:#999;
padding: 0px 5px;
font-weight: bold;
}

Grazie 1000!

laburno

C'è solo #subnav sotto l'header?
Così a occhio non sembra influire.

Dovresti cercare tra gli elementi sottostanti qualcuno che usi un margini o un padding superiore, tale da giustificare quello spazio.

Se non ce ne fossero, prova, sempre per tutti gli elementi sottostanti, a specificare che il margine superiore debba essere 0, così: margin-top:0;

mrlink

Sisi, c'è solo quella.. putroppo anche aggiungendo margin-top:0; non campia niente in firefox...

laburno

Prova il contrario, cioè aggiungendo margin-bottom:0 all'header.

mrlink

Niente purtroppo..

laburno

Ok, allora ho bisogno di vedere anche l'HTML