Ir ao conteúdo
  • Cadastre-se
Cosme Alves

Problema de centralização de banner.

Recommended Posts

Oi pessoal tudo bem? 

Estou dando uma editada em um site e tentei colocar um banner, porém ele não fica no meio, ele fica mais para o lado da esquerda...


Tentei usar o código <center></center> mas não resolveu... Será que alguém tem alguma solução?

rWCnWw1.jpg

 

Estou usando o seguinte código:
 

<center><div class="row"> 
                <div class="col-md-9">
                    <!-- Carousel -->
                    <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                        <!-- Wrapper for slides -->
                        <div class="carousel-inner">
                                                        <div class="item active">
                                <img src="template/img/1.jpg">
                            </div>
                                                        <div class="item ">
                                <img src="template/img/2.jpg">
                            </div>
                                                </div></center>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

@Cosme Alves Olá, 

Tente posicionar o elemento do banner usando o CSS.

primeiro tente usar o margin assim:

#banner{
	margin: 0 auto;
}  

Se não funcionar,  podes usar o margin-left ou position.

Se escolher position, use o relative e altere o left o quanto for necessário.

exemplo online: https://jsfiddle.net/qgycsvky/1/

Compartilhar este post


Link para o post
Compartilhar em outros sites

@dif Obrigado pela ajuda, mas mesmo assim não resolveu... Tentei fazer uma mudança na linha <div id="carousel-example-generic" por <div id="banner" mas bugou o site...

Compartilhar este post


Link para o post
Compartilhar em outros sites

@Cosme Alves O meu código só foi um exemplo.

Só para mostrar o uso da propriedade. Sugiro estudar ela e aplicar no seu elemento.

 

O margin zero auto, resolve na maioria dos casos. Mas isso não quer dizer que ele seja a única opção. Teste usando o position relative e setando o left. 

Mas evite de usar o elemento center, por ser um pouco antigo, sendo que há soluções em css.

Compartilhar este post


Link para o post
Compartilhar em outros sites

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 
Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Posicionar um objeto na tela</title>
<style type="text/css">
	#imgpos {
		position:absolute;
		left:50%;
		top:50%;
		margin-left:-110px;
		margin-top:-40px;
		}
</style>
</head>
<body>
<img src="logo.gif" width="220" height="80" 
alt="logo de 220 por 80 pixel" id="imgpos">
</body>
</html>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Pode ser que tenha outro estilo aplicado já.

 

tente da um "important".

 

margin: 0 auto !important;

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro 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





Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas publicações 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

×