Erro Firefox (Background-image x Padding)

[Ricardo.RFS 0]

Fala pessoall, beleza?

 

Seguinte, mesmo codigo porem coisas bem diferentes no IE e FF

 

 

#main {	background: #FFFFFF url('../img/bg_main.jpg') no-repeat 0px 0px;	width: 770px;	height: 100%;	font-size: 10px;	text-align: left;	padding: 0px 10px;	border: none;}#menu2 {	background: #FFF url('../img/bg_menu2.png') repeat-x 0px 0px;	color: #909090;	width: 770px;	height: 18px;	padding-top: 2px;	text-align: left;}

<div id="menu2"> 	<a href="" class="menu2">home</a> |	<a href="" class="menu2">parceiros</a> |	<a href="" class="menu2">cadastre seu evento</a> |	<a href="" class="menu2">cadastre-se</a> |	<a href="" class="menu2">apresentadores</a> |	<a href="" class="menu2">anuncie</a> |	<a href="" class="menu2">contato</a> |</div><div id="main">	<p><a href="http://www.net.com.br" title="Patrocinador NET"><img src="galeria/patrocinadores/net_full_0001.png" title="Patrocinador Net" alt="http://www.net.com.br/"></a></p>	<p>Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste Teste</p></div> <!-- div id="amin" -->

Alguem sabe pq q no FF fico com um espaço entre o menu e o conteudo? Pq que o padding aumento o tamanho da div e trouxe o bg?

 

Abrçs

[void 1]

posta o link ai q vai facilitar!!

[Ricardo.RFS 0]

http://www.canaldacidade.com.br/hiperbalada/beta/

[void 1]

para funfar no ff é só você tirar o padding

layout.css (linha 16)

#main {background:#FFFFFF url(../img/bg_main.jpg) no-repeat scroll 0%;border:medium none;font-size:10px;height:auto;margin:0px auto;max-width:770px;/*padding:0px 10px;*/text-align:left;width:770px;}

 

mas notei q o mesmo erro deu aki no meu IEca então acho melhor você rever sua css

[Ricardo.RFS 0]

não tem uma explicação por que que o padding adiciona 20 ao tamanho total?

[void 1]

eu nuam tenho!!

[Guilherme Rambo 4]

não tem uma explicação por que que o padding adiciona 20 ao tamanho total?

Porque tem 10px de cada lado 10+10 = 20 ;)[]'s

[void 1]

hahaha mas naum deveria ser assim né inside!!aparentemente é por causa disso!!é q que no box quando você diz q o width é 100px você está especificando o espaço interno!! isso quer dizer q ele vai garantir que o espaço interno sempre seja 100px, quando você da um padding de 10px você está dizendo q ele tem uma margem interna de 10px do conteudo a borda do elemento como o espaço para o conteudo foi especificado com 100px a largura total do elemento será de 120px.naum estamos acostumados com isso pq quando usavamos tabelas e colocavamos 100px de largura e usavamos um padding de 10px o espaço interno ia para 80px e acostumamos com isso!! fazer oq!! tb pq o ieca faz isso nos divs.para entendermos melhor sobre isso temos que ler a especificação da W3C!!the void

[Ricardo.RFS 0]

exatamente, achei que era = a tabelas, mas pelo visto me enganei...

 

ontem a noite tava = a imagem que postei, hj o IEca tb apresento a mesma coisa, portanto diminiu o tamanho para 750 http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

se você não pode com ele, se junte hehhee

 

valeu

[Guilherme Rambo 4]

Claro, hacks tambem ajudam nessas situações hein http://forum.imasters.com.br/public/style_emoticons/default/shifty.gif

 

Kra, não gostei das comparações aqui feitas em relação ao modo tradicional de trabalhar(com tabelas), o ideal quando se vai desenvolver nos padrões é esquecer os velhos conceitos por completo, assim vai deixando os novos conceitos entrarem na cabeça e você fica bom no que faz :D

 

[]'s

[Ricardo.RFS 0]

sem os velhos conceitos eu não faço nada...é cruel a migração, adoraria ter tempo de para e estuda W3C, Webstanders, CSS e etc. Mas os clientes não esperam... então tem q ir empurrando com a barriga, criando tecnicas e aprendendo com o passar do tempo...

[Ricardo.RFS 0]

o IE não soma e o FF sim, tem HACK para isso?

[Guilherme Rambo 4]

tem, no ie diminui as dimensões, ou o padding, pra igualar, exemplo:

width:700px;padding:0 10px; /* no ie ficara com 720px de largura */_width:680px; /* 680(width)+20(padding) = 700, ficara igual e todos viverão felizes para sempre */

[]'s

[Ricardo.RFS 0]

eu usei o MAX-WIDHT (parece que funciono!)pessoall to apanhando agora com uma coisa os float.to tendo que faze float pra tudo quanto que é lado. uns dentros dos outros e não ta ficando legal...alguem me ajuda ai?se puderem me add no msn, to quase tercerizando o desenvolvimento desta porcaria ou voltando pra tabela nesse layout.ricardo.floriano(arrobaaa)floriano.ppg.brHELLLLLLLLLPPPPPwww.canaldacidade.com.br/hiperbalada/beta/abrçs

[Ricardo.RFS 0]

Padding e Margin por Maujor

 

http://www.maujor.com/tutorial/joe/cssjoe7.php