-1

Quero fazer um menu como esta na foto só que com um fundo cinza.navegador

Código do css:

#menu ul{
    position:absolute;
    list-style:none;
    text-transform:uppercase;
    left:-40px;
    top:54%;

}

li{

    margin:-20px 50px 0px 50px;
    background-color:darkgray;
    text-align: center;
    display:inline-block;
    padding:10px 65px 10px 2px;

}
2
  • Boa noite! Aconselho colar o código para ajudarmos, mas mesmo assim é muito simples e de fácil alteração. Tem muita pouca informação na sua publicação. Impossível alguém poder ajudar sem saber mais. Até mais! 1/12/2018 às 20:55
  • Coloca seu html tb
    – hugocsl
    1/12/2018 às 22:34

1 Resposta 1

0

Apartir do Exemplo Abaixo, você ira poder criar um Top Nav de seu gosto, você pode alterar código e acrescentar o que deseja ou ate mesmo criar um em base deste:

<html>
<head>
<style>
body {margin: 0;}

ul.topnav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

ul.topnav li {float: left;}

ul.topnav li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-style: oblique;

}

ul.topnav li a:hover:not(.active) {background-color: #111;}

ul.topnav li a.active {background-color: #0095ff;}

ul.topnav li.right {float: right;}

@media screen and (max-width: 600px){
    ul.topnav li.right, 
    ul.topnav li {float: none;}
}
</style>
</head>
<body>

<ul class="topnav">
  <li><a class="active" href="#">Home</a></li>
  <li><a href="#">Movies</a></li>
  <li class="right"><a href="#">Logout</a></li>
</ul>

<div style="padding:0 16px;">
  <h2>Seu Conteúdo</h2>
</div>

</body>
</html>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .