Deshágase de la altura fija en su encabezado, luego use overflow: hidden; en eso. Ahora la altura de su encabezado dependerá de lo que esté dentro del div. Deshágase del margen inferior: 1em; en su logotipo para que se ajuste mejor.
Establezca la altura de línea en los enlaces en su navegador a la misma altura en píxeles del encabezado. por ejemplo: la imagen tiene 30 píxeles de alto, una {altura de línea: 30 píxeles; }
También podría simplemente mover su navegador a la derecha de la pantalla ya que no hay nada allí.
- ¿Cuál es el mejor orden para usar sitios web u otro software durante el día?
- Desde una perspectiva de desarrollo web, ¿por qué sitios como nytimes.com y huffingtonpost.com tienen versiones móviles en lugar de una versión receptiva?
- ¿Qué es más fácil de administrar, una aplicación móvil o un sitio web?
- ¿Es posible hacer una aplicación o sitio web sin alojarlo en un servidor?
- ¿Cuáles son los puntos de interrupción típicos del ancho de pantalla que se deben considerar para las consultas de medios CSS al diseñar un sitio web receptivo, ya que los dispositivos tienen todas las formas y tamaños?
Parece que ya tienes una solución para dispositivos móviles. El botón de navegación móvil que agregó se ve muy bien. si REALMENTE desea hacer espacios de línea solo en dispositivos móviles sin consultas de medios, puede hacerlo con bootstrap usando las clases visible-sm, visible-md u hidden-sm (funciona para todos los tamaños de pantalla). Por ejemplo:
creará un descanso solo en los tamaños de pantalla xs.
Las consultas de medios son la mejor manera de hacer las cosas y puede cambiar fácilmente el margen de esta manera.
