La fijación de separación entre divs extraño en mi sitio

Question

Hola, me parece que tienen un problema de CSS, con respecto a la separación de mis <div>s en mi sitio.

Si apunta su navegador a www.marioplanet.com verá un espacio extraño después de mi barra de navegación de Apple de temática.

Me preguntaba si alguien me puede ayudar a identificar por qué se añadió esta separación, y cómo puedo eliminarlo, ya que es indeseable.

Además, creo que tiene algo directamente relacionado con la barra de navegación, ya que sin la barra de navegación, esto no es problema de espacio.

Gracias!

Answer 1

Es a causa de <a></a> presente en <li id="gn-support"><a></a></li>

Answer 2

Eso DIV #globalheader que contiene la barra de menú tiene 18px de margen vertical (arriba y abajo). Así que, naturalmente, lo que sigue es desplazado por 18px.

#globalheader {
height:37px;
margin:18px auto;
position:relative;
width:771px;
z-index:1;
}

Answer 3

Es posible que desee eliminar los gn-ipad, GN-itunes y GN-apoyo

elementos de su html.

Answer 4

Se puede olvidarse de la parte del margen de 18px en el artículo globalheader, a continuación, cambiar el ancho del elemento globalnav a 1000px:

globalnav {

margin: 0; padding: 0; anchura: 1000px; }

Answer 5

Bueno, el problema tiene que ver con que la anchura fija en:

#globalheader{
      width: 769px;  //this is too small and actually not needed.
}

La lista que figura (#globalnav) tiene un ancho representado de 830px (tiene algún espacio en blanco al final no investigó para ver de donde vino. Así que si se quita el ancho fijo de globalheader y añadir un marginalmente izquierdo de 200 píxeles a #globalnav va a centrarlo y deshacerse del espacio.

Además, si usted puede ver por qué su lista tiene un montón de espacio en blanco a la derecha de la misma ampliación de su tamaño a 830px que sólo puede hacerlo un margen izquierda y margen derecha del automóvil y el centro de la lista dentro del div encabezado mundial .

descubierto dónde el espacio extra en el extremo de la ul está viniendo de elementos de la lista-itunes GN y GN-soporte son ambos representación con 103px de ancho. esto está llegando desde el (regla CSS #globalheader #globalnav LI A) Puede anular el ancho en (#globalheader #globalnav li # gn-soporte A), así como la (#globalheader #globalnav li # gn-iTunes A) css reglas y que deben fijarlo así sin recurrir a la solución anterior.

Answer 6

Si cambia el ancho de globalheader va a funcionar.

#globalheader { height:37px; margin:auto; position:relative; width:515px; z-index:1; }

Si desea agregar más enlaces de navegación que más tarde se tendrá que aumentar el ancho de globalheader.