0

puse cada ul al lado de la otra con un display inline-bloc pero la ultima lista que tiene la class choose-general queda mas abajo que las demás, no a la misma altura, como puedo hacer que si lo haga? ya intente llamando desde la class y añadiéndole un margen-top de -20% pero se agrande el background, no sube la lista

     <div class="choose">
      <ul>
        <li><h5>Americas</h5></li>
        <li>Argentina</li>
        <li>Canada</li>
        <li>Mexico</li>
        <li>Brasil</li>
        <li>United States</li>
      </ul>
      <ul>
        <li><h5>Europe</h5></li>
        <li>United Kingdom</li>
        <li>France</li>
        <li>España</li>
        <li>Belgium</li>
        <li>Italy</li>
      </ul>
      <ul>
        <li><h5>Asia/Pacific</h5></li>
        <li>India</li>
        <li>Australia</li>
        <li>Malasya</li>
        <li>Singapore</li>
        <li>China</li>
      </ul>
      <ul class="choose-general">
        <li><h5>All Other Locations</h5></li>
        <li>International</li>
      </ul>
    </div>

     css/SASS
     
    .choose{
      background-color: $color-general;
      ul{
       list-style: none;
       display:inline-block;
       font-size: small;
        li{
        margin-bottom: 10px;
        }
      }
     }

1 respuesta 1

0

Puedes ocupar css grid con lo cual se hace más fácil alinear en vertical

.choose{
 display: grid;
 grid-template-columns: repeat(4,1fr);
}
ul{
    list-style: none;
    font-size: small;

  }
li{
  margin-bottom: 10px;
}
 <div class="choose">
      <ul>
        <li><h5>Americas</h5></li>
        <li>Argentina</li>
        <li>Canada</li>
        <li>Mexico</li>
        <li>Brasil</li>
        <li>United States</li>
      </ul>
      <ul>
        <li><h5>Europe</h5></li>
        <li>United Kingdom</li>
        <li>France</li>
        <li>España</li>
        <li>Belgium</li>
        <li>Italy</li>
      </ul>
      <ul>
        <li><h5>Asia/Pacific</h5></li>
        <li>India</li>
        <li>Australia</li>
        <li>Malasya</li>
        <li>Singapore</li>
        <li>China</li>
      </ul>
      <ul class="choose-general">
        <li><h5>All Other Locations</h5></li>
        <li>International</li>
      </ul>
    </div>

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.