Problema com CSS em navegadores diferentes

Assuntos Gerais
#1

Olá pessoal, estou com o seguinte problema.

Tenho esse CSS, ele é bem antigo e estou fazendo modificações nele pra adaptar pra outros navegadores, já que na época que ele foi desenvolvido só havia IE e Netscape.

[code] /* Página de Menu /
.menu {
font-family: Verdana;
font-size: 10px;
border-top: 1px solid #DEE3E7; / #CCCCCC */
border-bottom: 0px;
height: 100%;
width: 100%;
}

.menu font , .menu font a
{
font-size: 10px;
font-weight: bold;
color: #333333;
height: 20px;
padding-left: 3px;
padding-top: 3px;
padding-bottom: 3px;
cursor: hand;
}

.menuNivel1 {
width: 100%;
background-color: #EFEFEF;
}

.menuNivel1,
.menu a {
<!–[if !IE]> -->
line-height:19px; /* Outros /
<!–[endif]–>
<!–[if IE]>
height:12px; / IE */
<![endif]–>

}

.menu a {

              color: #3252DD;
              width: 100%;
              border-bottom: 1px solid #DEE3E7; /* #CCCCCC */
              padding-left: 10px;
              padding-top: 3px;
              padding-bottom: 3px;
              }

.menu a:hover {
color: #FFFFFF;
background-color: #0066FF;
}

.menuSeta {
font-size: 30px;
font-family: MS Sans Serif, Verdana;
text-align: center;
color: #006699;
/behavior: url("/js/menu.htc"); /**/
background: #DEE3E7; / #C0C0C0 /
border-top: 1px #FFFFFF solid;
border-left: 1px #FFFFFF solid;
border-bottom: 1px #98AAB1 solid; / #808080 /
border-right: 1px #98AAB1 solid; / #808080 */
padding-top: 1px;
padding-left: 1px;
padding-bottom: 1px;
padding-right: 1px;
}

.menuSetaDown {
border-top: 1px #DEE3E7 solid; /#98AAB1/
border-left: 1px #DEE3E7 solid; /#98AAB1/
border-bottom: 1px #DEE3E7 solid; /* #FFFFFF #808080 /
border-right: 1px #DEE3E7 solid; / #FFFFFF #808080 */
padding-top: 2px;
padding-left: 2px;
padding-bottom: 0px;
padding-right: 0px;
}

@import url(/especifico/css/menu.css);[/code]

O meu problema está nessa parte:

[code] .menuNivel1,
.menu a {
<!–[if !IE]> -->
line-height:19px; /* Outros /
<!–[endif]–>
<!–[if IE]>
height:12px; / IE */
<![endif]–>

}[/code]

Tenho que fazer esse line-height:19 para os navegadores que não forem IE.

E o height:12px é quando se usa o IE.

O problema é que ele não está sendo aplicado nos outros navegadores que não sejam o IE, e todos estão pegando a configuração de height:12px;

Alguem teria alguma idéia de como resolver isso?

Grato, Lucas

#2

Crie normalmente a regra para não IE e, apenas sobrescreva caso seja IE.

[code]
.menu a {
line-height:19px; /* Outros */
}

[/code]
#3

[quote=drsmachado]Crie normalmente a regra para não IE e, apenas sobrescreva caso seja IE.

[code]
.menu a {
line-height:19px; /* Outros */
}

[/code][/quote]

Resolveu meu problema.

Muito obrigado ^^

#4

Uma outra opção seria verificar qual browser via javascript e, então, usando DOM, definir a propriedade.
Para isso, no evento onload da tag body, você deveria chamar uma função que realizasse essa verificação e executasse a configuração.

#5

[quote=drsmachado]Uma outra opção seria verificar qual browser via javascript e, então, usando DOM, definir a propriedade.
Para isso, no evento onload da tag body, você deveria chamar uma função que realizasse essa verificação e executasse a configuração.[/quote]

Então… eu cheguei a fazer uma verificação com javascript pra ver qual navegador estava usando e por incrivel que pareça, a verificação acusou que eu estava usando IE sendo que estava no Chrome, já no Firefox ele mostrou que eu estava usando um navegador diferente do IE, por isso não cheguei a usar essa solução.

Mas por esse modo no CSS ja resolveu meu problema.

#6

[quote=LucasAdri07][quote=drsmachado]Uma outra opção seria verificar qual browser via javascript e, então, usando DOM, definir a propriedade.
Para isso, no evento onload da tag body, você deveria chamar uma função que realizasse essa verificação e executasse a configuração.[/quote]

Então… eu cheguei a fazer uma verificação com javascript pra ver qual navegador estava usando e por incrivel que pareça, a verificaçã o acusou que eu estava usando IE sendo que estava no Chrome, já no Firefox ele mostrou que eu estava usando um navegador diferente do IE, por isso não cheguei a usar essa solução.

Mas por esse modo no CSS ja resolveu meu problema.[/quote]
Estranho, normalmente Chrome é identificado como Netscape…
Ao menos em scripts que validam navegadores que eu uso para brincar com ajax.
Não lembro agora, mas aquela verificação que passei tem algumas variantes, que permitem “gambiarrar” o CSS para versões diferentes de IE.
Se der uma pesquisada, vai achar, com certeza.

#7

[quote=drsmachado][quote=LucasAdri07][quote=drsmachado]Uma outra opção seria verificar qual browser via javascript e, então, usando DOM, definir a propriedade.
Para isso, no evento onload da tag body, você deveria chamar uma função que realizasse essa verificação e executasse a configuração.[/quote]

Então… eu cheguei a fazer uma verificação com javascript pra ver qual navegador estava usando e por incrivel que pareça, a verificaçã o acusou que eu estava usando IE sendo que estava no Chrome, já no Firefox ele mostrou que eu estava usando um navegador diferente do IE, por isso não cheguei a usar essa solução.

Mas por esse modo no CSS ja resolveu meu problema.[/quote]
Estranho, normalmente Chrome é identificado como Netscape…
Ao menos em scripts que validam navegadores que eu uso para brincar com ajax.
Não lembro agora, mas aquela verificação que passei tem algumas variantes, que permitem “gambiarrar” o CSS para versões diferentes de IE.
Se der uma pesquisada, vai achar, com certeza.[/quote]

Tem sim, é só colocar exemplo <!–[if IE 6]> <!–[if IE 7]> e por ai vai.

#8

Surgiu mais um problema que ja não é no CSS.

Tem um banner em flash no rodapé do site, que está em uma pagina e está sendo chamado assim:

Essa pagina banners.asp é a seguinte:

	&lt;object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
	    codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
	 width="180" height="40" id="Ultramax" align=""&gt;
	 &lt;param name=movie value="/ImagensEsp/Ultramax.swf"&gt; &lt;param name=quality value=high&gt; &lt;param name=bgcolor value=#FFFFFF&gt; &lt;embed src="Ultramax.swf" quality=high bgcolor=#FFFFFF  width="250" height="60" name="Ultramax" align=""
	 type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"&gt;&lt;/embed&gt;
	&lt;/object&gt;

O banner em flash só aparece no IE, e em outros navegadores não…

Ja tentei trocar o INCLUDE virtual por INCLUDE file e mesmo assim não funcionou.

Existe alguma incompatibilidade desse tipo de codificação com navegadores que não sejam IE?

#9