Ir ao conteúdo
  • Cadastre-se
Regras do Clube do Hardware

CSS Tirar Espaço no Navbar

j3ffyog

Por j3ffyog
em Web e banco de dados

 Compartilhar

Posts recomendados

j3ffyog
 

j3ffyog

Postado
Postado

Olá, já criei meu navbar, porém encontro um problema com um pequeno espaçamento na parte superior do mesmo, as imagens no navbar estão no tamanho correto, como posso arrumar isso?  

<!doctype html>

<html lang="pt-br">
	<head>
		<title>Loja Pallace - O Diamante Mais Preciso!</title>
		<meta charset="utf-8">
		<link rel="stylesheet" href="css/vendors/plugins.css">
		<link rel="stylesheet" href="css/style.css">
		<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
		<meta name="discription" content="Loja Oficial do Habbo Pallacehotel.top, aqui você pode adquiri diversos beneficios!">
		<meta name="keywords" content="habbo, pallace, hotel, diamantes, lucrativo, jogo, compra, loja, raros, vip">
		<meta name="author" content="@j3ffyog">
	</head>
	<body>
		<nav class="navbar navbar-expand-lg navbar-light lg-light">
			<div class="container">
				<a class="navbar-brand h1 nb-0" href="#"> 
					<img src="images/Logo.png" alt="">
				</a>
				<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSite">
	                <span class="navbar-toggler-icon"></span>
	            </button>
				<div class="collapse navbar-collapse" id="navbarSite">
					<ul class="navbar-nav ml-auto">
						<li class="nav-item dropdown">
							<a class="nav-link" href="#">Inicio</a>
						</li>
						<li class="navbar-item dropdown">
							<a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown" id="navbarSite">Produtos</a>
							<div class="dropdown-menu">
								<a class="dropdown-item" href="#">Vip</a>
								<a class="dropdown-item" href="#">Diamantes</a>
								<a class="dropdown-item" href="#">Raros</a>
							</div>
						</li>
						<li class="navbar-item">
							<a class="nav-link" href="#">Sobre</a>
						</li>
					</ul>
				</div>
				<a class="navbar-brand ml-3" href="http://pallacehotel.top" target="_blank"> <img src="images/botaojogo.png" alt=""></a>
			</div>
		</nav>
		<header class="container">
			<div class="content">
				<div class="logo-container">
					<!--<img src="../images/Logo.png" alt=""-->
				</div>
			</div>

		</header>


		<!-- Jquery, Popper and Bootstrap in .js -->
		<script src="node_modules/jquery/dist/jquery.js"></script>
		<script src="node_modules/popper.js/dist/umd/popper"></script>
		<script src="node_modules/bootstrap/dist/js/bootstrap.js"></script>
	</body>
</html>

 

forum.png

Link para o comentário
Compartilhar em outros sites
GabrielSennaMs
 

GabrielSennaMs

Postado
Postado

@j3ffyog Pelo que eu percebi, você está usando o Bootstrap no seu projeto, esse padding vem dá class navbar do Bootstrap. ela adiciona um padding de 5rem, 1rem no seu menu.

 

Você pode contornar isso setando a propriedade padding para 0px e usando o !important para priorizar o valor.

Exemplo 

.navbar{
	padding: 0px!important;
}

.navbar > div > a.navbar-brand{
	padding: 0px!important;
}

 

Link para o comentário
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisa ser um usuário para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar agora
 Compartilhar
Ir à lista de tópicos

Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

Mais

×
×
  • Criar novo...