Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Solucionado (ver solución)
Solucionado
(ver solución)
1
respuesta

[Proyecto] Posicionamiento del encabezado

Hola mi nombre es Federico y quisiera en el caso del encabezado que contiene el logo y los items del menu de navegacion, sin perder la centralizacion, correr el logo hacia la izquierda o hacia la derecha y tambien tener la posibilidad de hacerlo con el bloque de los items de mi menu de navegacion., en ambos casos hacerelo de manera independiente, o sea jugar con mover a mi gusto uno o ambos.

CODIGO

    header{
background-color: #bbbbbb;
padding: 30px 0px;

}

.caja{ width: 940px; position: relative; margin: 0 auto; }

nav{ position: absolute; top: 11px; right: 0px; }

nav li{ display: inline; margin: 0 0 0 15px; }

nav a{ text-transform: uppercase; color: black; font-weight: bold; font-size: 22px; text-decoration: none; }

muchas gracias

1 respuesta
solución!

Hola Federico,

Para mover el logo hacia la izquierda o hacia la derecha sin perder la centralización, puedes utilizar la propiedad CSS "float". Por ejemplo, si quieres mover el logo hacia la izquierda, puedes añadir la siguiente regla CSS:

h1 img {
  float: left;
}

Si quieres mover el logo hacia la derecha, puedes utilizar la propiedad "float: right;". Recuerda que al utilizar "float", es posible que necesites ajustar los márgenes o el ancho de otros elementos para evitar que se superpongan.

Para mover los items del menú de navegación de manera independiente, puedes utilizar la propiedad CSS "float" también. Por ejemplo, si quieres mover el primer item hacia la izquierda, puedes añadir la siguiente regla CSS:

nav li:first-child {
  float: left;
}

Y si quieres mover el último item hacia la derecha, puedes utilizar la siguiente regla:

nav li:last-child {
  float: right;
}

Recuerda ajustar los márgenes o el ancho de los elementos según sea necesario para evitar superposiciones.

Espero que esta información te sea útil. Si tienes alguna otra pregunta, no dudes en preguntar. ¡Buena suerte con tu proyecto!

¡Saludos!

Si este post te ayudó, por favor marca como solucionado ✓. ¡Continúa con tus estudios!