0

Tengo un problema con el menú, estoy queriendo hacer un menú de una pagina web llamada LaEficazStore, al momento de desplegar el menú sale muy en desorden, alguien podría decirme que debo hacer para que salga ordenado?. mi codigo es el siguiente:

<html>
<head>
    <title>Menu Desplegable</title>

</head>
<body>
    <div id="header">
        <ul class="nav">
            <li><a href="">Inicio</a></li>
            <li><a href="">Servicios</a>

                    <li><a href="">Submenu1</a></li>
                    <li><a href="">Submenu2</a></li>
                    <li><a href="">Submenu3</a></li>
                    <li><a href="">Submenu4</a>
                        <ul>
                            <li><a href="">Submenu1</a></li>
                            <li><a href="">Submenu2</a></li>
                            <li><a href="">Submenu3</a></li>
                            <li><a href="">Submenu4</a></li>
                        </ul>
                    </li>

            </li>
            <li><a href="">Acerca de</a>
                <ul>
                    <li><a href="">Submenu1</a></li>
                    <li><a href="">Submenu2</a></li>
                    <li><a href="">Submenu3</a></li>
                    <li><a href="">Submenu4</a></li>
                </ul>
            </li>
            <li><a href="">Contacto</a></li>
        </ul>
    </div>
</body>

1
  • Agrega los estilos para que se te brinde una mejor ayuda
    – 404
    Commented el 21 feb. 2020 a las 22:03

1 respuesta 1

0

Tu principal problema esta en que no estas usando el modelo de caja correctamente, al dejar dentro del <li> las etiquetas <a>y <li> pegadas.

Incorrecto:

<li>
    <a href="">Submenu4</a>
      <li><a href="">Submenu1</a></li>
      <li><a href="">Submenu2</a></li>
      <li><a href="">Submenu3</a></li>
      <li><a href="">Submenu4</a></li>
</li>

Correcto:

<h1>Menu Incorrecto</h1>
<li>
   <a href="">Submenu4</a>
     <li><a href="">Submenu1</a></li>
     <li><a href="">Submenu2</a></li>
     <li><a href="">Submenu3</a></li>
     <li><a href="">Submenu4</a></li>
</li>
<hr/>
<!-- CORRECTO -->
<h1>Menu Correcto</h1>
<li>
   <span><a href="">Submenu4</a></span>
   <ul>
     <li><a href="">Submenu1</a></li>
     <li><a href="">Submenu2</a></li>
     <li>
        <span><a href="">Submenu3</a></span>
        <ul>
          <li><a href="">Submenu3.1</a></li>
          <li><a href="">Submenu3.2</a></li>
        </ul>
     </li>
     <li><a href="">Submenu4</a></li>
   </ul>
</li>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.