Imagem Background em Div

[danielvlopes 0]

OLá pessoal, tenho um div com uma imagem de background, beleza até ai perfeito... mas quando eu coloco um outro div por cima ou coloco mesmo que apenas um texto ou qualquer coisa dentro deste div a imagem de fundo não aparece. Para resolver este problema estava usando o display: table porém desta forma os elementos que estão com float acabam ficando desordenados. Alguem pode me dar outra alternativa para que a imagem apareça mesmo com um texto ou outro elemento por cima?

[Guilherme Rambo 4]

Como Criar um Tópico para seu Problema

 

[]'s

[Hunter_ 0]

Fala cara,

 

Tudo bom? Você não foi muito claro ao expor sua dúvida, ok?

 

Mas, vamos tentar ajudar ao máximo aqui:

 

Você colocou da seguinte forma:

"[...] uma imagem de background, beleza até ai perfeito... mas quando eu coloco um outro div por cima ou coloco mesmo que apenas um texto ou qualquer coisa dentro deste div a imagem de fundo não aparece.[...]"

 

Não ficou claro tua dúvida, mas pelo que entendi, qdo você põe uma div, ou outro elemento, p, ele so não mostrará o background do elemento abaixo dele se estiver setado uma cor de background para o elemento.

 

digamos você tem

 

<div id="geral"><span class="teste>teste</span></div>

suponhamos que você tenha as seguintes regras

#geral { background: url(images/image.jpg) bottom right}.teste { background: #FFF;}

o conteiner pai é a div#geral que contém o span com a classe teste q tem background branco, então SE o span ocupar toda a dimensão do conteiner pai ele ira ocultar a imagem de background da div#geral.

 

Se não for isso, poe um exemplo no ar para ajudar a tirarmos conclusões e te ajudar a resolver os problemas beleza?

[danielvlopes 0]

Não, o problema não é esse, é o seguinte:

 

#conteudo{	width:759px;	background-color: #FFFFFF;	background:url(../imagens/comum/conteudo_bg.jpg) bottom no-repeat;	margin:0px auto;}#menu_prod{	float:left;	margin:0px auto;	width:183px;}#cont_pag{	float: left;	width:520px;	margin:0px auto;}

<div id="conteudo">	<div id="menu_prod">	....	</div>	<div id="cont_pag">	QUALQUER COISA	</div></div>

Se eu colocar display: table no div conteudo a imagem de background aparece na boa mas estragra o posicionamento pq o div cont_pag fica abaixo do menu_prod . Se eu tiro o display table não aparece a imagem de fundo mas o layout funciona.

Mesmo que eu não coloque nada dentro dos divs que estão dentro do div conteudo o background não aparece... e como se os divs não fossem transparentes sacou? http://forum.imasters.com.br/public/style_emoticons/default/upset.gif

[Giovani 104]

Poste um link pra gente ver.

 

você pode me dizer pq está usando o display-table?

[danielvlopes 0]

Estava usando o display table para fazer com que a imagem de background do div conteudo apareça mesmo com outros divs sobre ela... porem as vezes da pau e desalinha tudo... por isso tirei o display: table O link é www.pacobikes.com/site_novo/contato.php Neste link já tirei o display table mas a imagem de fundo não aparece, o formulário de contato esta dentro do div cont_pag e a imagem de fundo está no div conteudo e podem ver que ela não aparece FF e no IE ela aparece porem não respeita o bottom e fica localizada no meio do site.

[Michael Rodrigues 0]

coloca no padrão w3c, eu tb ja tive este problema, eh somente as aspas.

 

#conteudo

{

width:759px;

background-color: #FFFFFF;

background:url("../imagens/comum/conteudo_bg.jpg") bottom no-repeat;

margin:0px auto;

}

[angelorubin 142]

Boa tarde,

 

Se entendi bem é só você definir height ou min-height no #conteudo que resolve.

 

Espero que ajude.