IE7:encabezado del menú de arriba

Question

Estoy teniendo problemas con IE7.Tengo un encabezado, el cual es una IMG.En virtud de que tengo un div que representa un menú, que tienen que estar conectados el uno al otro, sin espacio entre ellos.Ambos son 1000px de ancho.En Opera y FireFox la cabecera y el menú están perfectamente conectados uno al otro.Sin embargo, en IE7, hay un pequeño espacio entre el menú DIV y el IMG.He tratado de definir explícitamente el relleno y el margen en la IMG, sin embargo no funciona.He tenido este problema antes, por lo que parece ser una IE7 capricho.

Mi Código HTML:

<div id="middle">
  <img id="ctl00_headerHolder_headerImage" src="pictures/headers/header_home.jpg" style="border-width:0px;" />

  <div id="ctl00_menuPanel" class="menu">
    <a id="ctl00_home" href="Default.aspx" style="color:#FFCC33;">Home</a> |
    <a id="ctl00_leden" href="Leden.aspx">Leden</a> |
    <a id="ctl00_agenda" href="Agenda.aspx">Agenda</a> |
    <a id="ctl00_fotos" href="Fotos.aspx">Foto's</a> |
    <a id="ctl00_geschiedenis" href="Geschiedenis.aspx">Geschiedenis</a> |
    <a id="ctl00_gastenboek" href="Gastenboek.aspx">Gastenboek</a>
  </div>
</div>

Answer 1

Pruebe el IE Developer Toolbar, que le permitirá inspeccionar lo que está pasando con los elementos y darle contornos de las áreas cubiertas.Podría darle una mejor comprensión del problema.

Answer 2

La solución:

img {
padding: 0px;
margin: 0px;
display: block;
}

pantalla:bloque

Answer 3

Me quedo mucho en esto.En lugar de cazar el comportamiento específico, trate de cordura expresamente la comprobación de la configuración de relleno y propiedades de margen para img/div/etc selectores de 0, establezca border-style:ninguno border-width:0px border="0" etc.

Es decir Dev Barra de herramientas es un deber-tener, pero si se le ayuda a averiguar de píxel único problemas es poco probable.

Answer 4

En lugar de recurrir a la pantalla de bloque, tenga en cuenta que IE7 no algunos en serio las cosas raras con espacios en blanco;pruebe a quitar el espacio en blanco entre la imagen y el div, y a ver qué pasa.

Answer 5

CSS Restablece (como el YUI Reset CSS) son excelentes para este tipo de cosas.Restablecer acolchados, márgenes, y de otras propiedades de visualización en una gran cantidad de elementos HTML para minimizar las diferencias en la visualización.

Answer 6

La solución de...pantalla:bloque

Esa pregunta no podía ser contestadas correctamente sin conocer el modo de representación de que el navegador se en;usted necesita decirle a la gente qué tipo de documento que usted tiene si usted tiene problemas de representación de CSS.La imagen de comportamiento al que te refieres es diferente en las peculiaridades del modo como oposición a las normas modo.Un mínimo de caso de prueba debe incluir un completo documento HTML y el CSS para reproducir el problema.Por favor, no pedir a la gente para ayudar, sin darles la información que necesitan para responder fácilmente, sin necesidad de perder su tiempo...

Answer 7

La verdadera solución:

#middle { font-size: 0; line-height: 0; }