Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

The XeoN

[Resolvido] Background...

Recommended Posts

Ae galera tudo bem?

 

Meu problema é o seguinte..

 

Tenho esse codigo css aqui:

 

#wrap
{
	width: 925px;
	margin: 15px auto;
	position: relative;
	clear: both;
}

#headerContent
{
	clear: both;
}

#header
{
	background: url(../images/header.png) no-repeat center top;
	position: relative;
	width: 925px;
	height: 193px;
	clear: both;
}

#header h1
{
	background: url(../images/banner/1407884226.png) no-repeat bottom center;
	width: 913px;
	height: 180px;
	margin: 0 auto;
	padding-top: 12px;
}

#content
{
	clear: both;
	width: 925px;
	margin: 0 auto;
	background: url(../images/center.png) repeat-y center;
}

#sidebar
{
	padding: 10px 15px;
	width: 200px;
	position: relative;
	float: left;
}

#sidebar h4
{
	height: 28px;
	width: 200px;
	background: url(../images/titleL.png) no-repeat;
	text-shadow:  2px 1px 2px #000000;
	font-size: 12px;
	font-weight: bold;
	line-height: 25px;
	padding-left: 25px;
}

#sidebox
{
	width: 180px;
	margin-bottom: 15px;
	background-color:#0F0F0F;
	padding: 10px;
}

#main
{
	float: right;
	width: 660px;
	text-align:left;
	padding: 10px;
	margin: 0 5px;
}

#main .contentBox
{
	padding: 10px;
	background-color: #0F0F0F;
	margin-bottom: 15px;
}

#main h2
{
	font-size: 13px;
	font-weight: bold;
	border-bottom: 1px solid #333333;
	height: 18px;
}

E esse XHTML aqui:

 

<div id="wrap">

	<div id="headerContent">
    
        <div id="header">
            <h1></h1>
        </div>
        
        <div id="div_menu">
            <ul id="menu">
                <li><a href="#">HOME</a></li>
                <li><a href="#">PANEL</a></li>
                <li><a href="#">REGISTER</a></li>
                <li><a href="#">DOWNLOADS</a></li>
                <li><a href="#">RANKINGS</a></li>
                <li><a href="#">VIPS</a></li>
                <li><a href="#">CONTACT</a></li>
                <li><a href="#">SHOPPING</a></li>
                <li><a href="#">FORUM</a></li>
            </ul>
        </div>
        
	</div>
    
    <div id="content">
    
    	<div id="sidebar">
        
            <h4>Login</h4>	
            <div id="sidebox">
                <form action="#" method="post">
                    <input type="text" class="text" id="username" value="Login" />
                    <input type="password" class="text" id="userpwd" value="Senha" />
                    <input type="submit" class="button" value="Logar" />
                </form>
                <strong><a href="#">Recuperar minha senha</a></strong>
            </div>   
            
            <h4>Servidores</h4>	
            <div id="sidebox">
            	asd
            </div>   
            
            <h4>Configurações</h4>	
            <div id="sidebox">
            	asd
            </div>   
            
            <h4>Informações</h4>	
            <div id="sidebox">
            	asd
            </div>   
          
        </div>
        
       	<div id="main">
        
        	<div class="contentBox">
            	<h2>Ultimas Noticias</h2>
			</div>
            
        	<div class="contentBox">
            	<h2>Top Personagens</h2>
			</div>
            
        	<div class="contentBox">
            	<h2>Top Guild Score</h2>
			</div>
            
        </div>
    
    </div>
    
</div>

 

Mas o background da content nao funciona de jeito nenhum! Ja verifiquei o caminho da imagem, ta certo ...

 

Me ajuda aee :)

Compartilhar este post


Link para o post
Compartilhar em outros sites

Ae funcionooooooou! *-------*

 

Valeu mesmo cara :D

 

 

Mas eu nao entendi kkkk

 

Porque isso resolveu meu problema?

 

Sou inexperiente em css, sou somente programador e estou iniciando agora com css...

 

Mas valeu mesmo cara!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Por que os float dos elementos que estão dentro da div#content esvaziam ela. Isso é uma ação natural do float, pois como o próprio nome diz, ele flutuam.

 

Sendo assim basta adicionar um elemento de bloco com clear.

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

Hmmm .. entendi cara!

 

Ultima coisa:

 

Como eu poderia colocar esse clear:both de outro jeito?

 

Soh pra ele nao ficar em um br, queria colocar ele em uma div.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.