"Problemas" com a propriedade Background

[uiLhian 1]

Bom eu tenho a seguinte classe:

.vborda {	background: url("../imagens/borda.gif") no-repeat 365px 67px;}

o que ta acontecendo é o seguinte no IE7 ela aparece normal, ja no Firefox e Opera não, ela só aparece quando uso a propriedade "height", só que ae "buga" no IE pois a div onde a classe ta sendo aplicada fica do tamanho do valor colocado na propriedade "height".

 

Caso alguem possa ajudar, agradecido desde ja.

[Samuel Machado 0]

já tentou assim?

 

.vborda {	background-image: url("../imagens/borda.gif");	background-repeat: no-repeat;	background-position: 365px 67px;}

[uiLhian 1]

o que mudou ae ?nenhuma das duas "funciona".

[Poe 0]

O que mudou é que a dele tem mais bytes que a sua. rs

 

 

Então, o seguinte, o problema é que você vai ter que ligar o "float" do elemento. Já sei qual é o problema (passei por isso).

 

Coloca assim:

 

.vborda {	background: url("../imagens/borda.gif") no-repeat 365px 67px;	float: left; /* ou o que você for usar */}

[uiLhian 1]

Poe, deu certinho valeu. Só que agora bateu outra duvida, porque tem que ser o float ?

[Poe 0]

Porque o elemento em questão, quando não tem float ligado, não vai variar de acordo com o conteúdo, mas sim quando você define a sua altura (height). :)

[uiLhian 1]

hummm... tendeu, valeu ae.

[Poe 0]

;) Foi uma resposta bem simplória, mas em síntese é isso mesmo! :D Falows!

[uiLhian 1]

bom eu ia edita a resposta acima, mas vai aqui mesmo ja que respondeu... quando coloquei a propriedade float ali, percebi que deu uma diferencia uma mexida no corpo do site, sei la parece ter "aumentado" o tamanho, mexido, pois antes não aparecia a barra de rolagem pois o conteudo sobrava uns 10px, agora apareceu... da uma diferença mesmo ?

[Poe 0]

Provavelmente é o padding interno. Você precisa definir o tamanho horizontal agora (width) e ver que se você colocou padding interno a somatória dos paddings MENOS o tamanho real do div vai dar o tamanho correto.

 

Ex.:

 

Tamanho real 300px;

 

width: 280px; /* 280 + 10 + 10 = 300 */padding: 10px;

[uiLhian 1]

Cara eu até entendi o que você quis dizer ae e tal, ae tava mexendo aqui fazendo uns teste e fiquei meio cabrero o porque a div aumenta pra baixo, quando coloco a classe .vborda no div com a classe conteudo. bom ta ae as 2 IDS e a classe. É só por curiosidade mesmo, pois quando tiro o magin: 5px; ali da ID conteudo, eu posso coloca e tirar a imagem que a estrutura não muda, ae quando coloca o magin ali da uma almentada pra baixo. "Obs.: a figura borda não pega tudo a div, ela só ocupa a metada da div só, e por isso eu não vejo o porque aumenta pra baixo a div, porque a imagem não é grande o suficiente pra "dar soma", com o margin ali."

 

#corpo {	text-align: left;	margin: 0.5em auto 0.5em auto;	width: 620px;	border: 3px solid #5D5B55;	background-color: #FFF;}#conteudo {	margin: 5px;	width: 610px;	position: relative;}.vborda {	background: url("../imagens/borda.gif") no-repeat 365px 67px;	float: left;}

Caso alguem saiba agradecido.