HTML - Problemas con el posicionamiento de logo en Header

 
Vista:
sin imagen de perfil
Val: 1
Ha aumentado su posición en 55 puestos en HTML (en relación al último mes)
Gráfica de HTML

Problemas con el posicionamiento de logo en Header

Publicado por Ruben (2 intervenciones) el 31/12/2019 19:29:35
Estoy utilizando Bootstrap para hacer una web y quiero posicionar el logo en el centro del nav y que sobresalga de la barra de navegación, el problema es que el logo no me lo posiciona en en el centro y me lo hecha para derecha. El ml-auto del último ul se altera https://imgur.com/a/KrMTuPi

dejo aquí el codigo

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<nav class="navbar navbar-expand navbar-light navbarvalues">
    <div class="container">
  <div class="collapse navbar-collapse" id="navbarSupportedContent">
 
    <ul class="navbar-nav mr-auto">
      <li class="nav-item">
        <a class="nav-link" href="#"><i class="fas fa-search iconnavbar"></i><span class="sr-only">(current)</span></a>
      </li>
    </ul>
 
    <a class="navbar-brand" href="#"><img alt="Seis" src="img/logo.svg" class="logo"></a>
 
    <ul class="navbar-nav ml-auto">
      <li class="nav-item">
      <a class="nav-link" href="#"><i class="far fa-envelope iconnavbar"></i><span class="sr-only">(current)</span></a>
      </li>
    </ul>
 
 
  </div>
  </div>
  </nav>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
.navbarvalues {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
}
 
.iconnavbar {
    font-size: 20px;
    padding: 10px 0;
}
 
 
.logo {
    width: 80px;
    position: absolute;
    top: 0;
}
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Aqwatte
Val: 12
Ha disminuido su posición en 6 puestos en HTML (en relación al último mes)
Gráfica de HTML

Problemas con el posicionamiento de logo en Header

Publicado por Aqwatte (3 intervenciones) el 13/01/2020 20:59:38
yo creo que ya lo resolvi (no me jusguen si lo hice mal, soy solo un niño :/)
aqui el codigo:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<nav class="navbar navbar-expand navbar-light navbarvalues">
    <div class="container">
  <div class="collapse navbar-collapse" id="navbarSupportedContent">
 
    <ul class="navbar-nav mr-auto">
      <li class="nav-item">
        <a class="nav-link" href="#"><i class="fas fa-search iconnavbar"></i><span class="sr-only">(current)</span></a>
      </li>
    </ul>
 
    <a class="navbar-brand" href="#"><center><img alt="Seis" src="img/logo.svg" class="logo"></center></a>
 
    <ul class="navbar-nav ml-auto">
      <li class="nav-item">
      <a class="nav-link" href="#"><i class="far fa-envelope iconnavbar"></i><span class="sr-only">(current)</span></a>
      </li>
    </ul>
 
 
  </div>
  </div>
  </nav>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar