Jump to content

Centralizar menu


John Hebert Trindade
 Share

Go to solution Solved by John Hebert Trindade,

Recommended Posts

John Hebert Trindade

Bom dia pessoal, não sei porque não consigo centrar minha barra de menu, já devo ter passado por cima do erro e não o vejo, será que alguém poderia ajudar me. Desde já obrigado.

<div id="area-menu">
<nav id="menu">
  <ul id="navegacao">
    <li class="selecionado"><a href="index.html"></a></li>
    <li ><a href="artista.html"></a></li>
    <li ><a href="eventos.html"></a></li>
    <li ><a href="contacto.html"></a></li>
  </ul>
</nav>
</div>

Ficheiro css

#area-menu{
	padding-top: 5px;
}

nav#menu{
	margin: 0 auto;
	padding: 0;
	display: flex;
	align-items:center;
	max-width: 1020px;
	width: 100%;
	height:55px;
}

nav#menu ul{
	display: block;
	text-align: center;
	justify-content:center;
	align-items:center;
	padding: 0;
	margin: 0 auto;
	width: 100%;
}

nav#menu ul li{
	float: left;
	padding: 0px;
	list-style: none;
	position: relative;
	margin: 5px;
}

nav#menu ul li a{
	display: block;
	width: 130px;
	font-family: 'Niconne', cursive;
	color:#8a1100;
	font-size:20px;
	padding:9px 17px;
	text-decoration: none;
	height:40px;
	box-shadow:2px 2px 3px #555;
	border-radius:3px;
	background: url('../imgs/menu.jpg') center bottom no-repeat;
	cursor:default;
	z-index: 1;
}

 

Link to comment
Share on other sites

  • Solution
John Hebert Trindade

Boa tarde pessoal, consegui centralizar segue o código css de como ficou.

 

Em 01/09/2021 às 11:16, John Hebert Trindade disse:
#area-menu{
	padding-top: 5px;
}

nav#menu{
	margin: 0 auto;
	padding: 0;
	max-width: 1020px;
	width: 100%;
}

nav#menu ul{
	display: block;
	padding: 0;
	margin: 0 auto;
	width: 100%;
	height: auto;
	position: relative;
}

nav#menu ul li{
	display: inline-block;
	padding: 0px;
	list-style: none;
	position: relative;
	margin: 5px;
}

 

 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.