[Resolvido]Erro De 4Px No Ieca 7 E O Ieca 8

#1 Kahor

12 Horas

Usuários
230 posts

Sexo:Masculino

Posted 09/12/2009, 09:10

Bom dia,

No meu menu, eu usei um margin-top negativo, para que ele fique colado com a img de topo, para entederem confiram na url logo abaixo.

Pois bem, no IE 7 eu tenho que usar um margin-top com -11px, só que no IE8 FF e Opera, eu tenho que usar um -7px para ficar "bonito". Só que eu nao acho solução para o IE7, podem me ajudar?

Aqui esta o link http://www.visualsinalizacao.net/site/

E aqui o code somente do menu:

#top {background: url('img/bgtop.gif') no-repeat; width: 1003px; min-height: 242px; display: block;}

#top #menu {
		text-align: center;
		float:left;
		position:relative;
		left: 18%; 
		margin-top: -7px; }

#top #menu ul {
		list-style: none; 
		margin: 0;
		padding: 0;
		position: relative;
		left: ;
		float: left;} 
		
#top #menu ul li {float: left;}

Attached Files

BUG.jpg 68.42KB 0 downloads

Edição feita por: Victor Hugo Odo, 10/12/2009, 13:25.

#2 Victor Hugo Odo

Doutor

Administradores
779 posts

Sexo:Masculino
Localidade:São Paulo - SP
Interesses:Compartilhar conhecimentos!

Posted 09/12/2009, 09:53

Bom... Não é bonito... Mas cara, nem perde tempo, usa um termo condicional. Como é só esse trechinho mesmo, tudo bem...

<head>
...
<link rel="stylesheet" type="text/css" href="css.css" />
<!--[if IE 7]>
<style>
#top #menu {
 margin-top: -11px; }
</style>
<![endif]-->
...
</head>

referência: Link para se aprofundar no assunto.

Bons ventos!

(ok2)

Edição feita por: Victor Hugo Odo, 10/12/2009, 09:29.
Organizar conteúdo.

Fórum WMO - Administrador

#3 Thiago Retondar

Turista

Usuários
30 posts

Sexo:Masculino
Localidade:São Paulo

Posted 09/12/2009, 23:29

Opa... Opa...

Olha só o começo do CSS:

@charset "utf-8";
/* CSS Document */
 
 
* {margin: 0 auto;} /*Está "errado" aqui, não?*/

Nesse seu CSS Reset - que não reseta

- está apena falando que todos elementos vão está centralizados! Isso não vai tirar as diferenças entre browsers... Faça assim:

*{ margin: 0; padding: 0; }

<!--
Blog OGordo: http://ogordo.com //Eu só escrevo aí, mas não sou gordo.

Twitter: @thiagoretondar
-->

#4 Kahor

12 Horas

Usuários
230 posts

Sexo:Masculino

Posted 10/12/2009, 09:04

Ohh nao deu certo as 2 maneiras, eu coloquei:

* {margin: 0; padding: 0;}
		
<!--[if IE 7]>
#top #menu {margin-top: -11px;}
<![endif]-->

Depois somente o if IE, depois somente o reset, e nada =/

E Victor valeu pelo link, ajudou aqui em outras coisas heheeh
E Thiago, eu nem me toquei desse detalhe também! Valeu (y)

EDIT: Eu uso o IE 8 aqui e para ver no 7 uso aquele modo de compatibilidade, ai nesse if ele vai reconhecer somente no 7 mesmo ou no modo do 8 tb?

Edição feita por: Kahor, 10/12/2009, 09:07.

#5 Victor Hugo Odo

Doutor

Administradores
779 posts

Sexo:Masculino
Localidade:São Paulo - SP
Interesses:Compartilhar conhecimentos!

Posted 10/12/2009, 09:26

Foi mal Kahor, embolei tudo ali não deu pra entender...

<head>
...
<link rel="stylesheet" type="text/css" href="css.css" />
<!--[if IE 7]>
<style>
body{
 background:#f00;}
</style>
<![endif]-->
...
</head>

<head>
...
<link rel="stylesheet" type="text/css" href="css.css" />
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="cssie7.css" />
<![endif]-->
...
</head>

Bons ventos

(ok2)

Fórum WMO - Administrador

#6 Kahor

12 Horas

Usuários
230 posts

Sexo:Masculino

Posted 10/12/2009, 10:05

Mais ai fica como comentario no HTMl com o

#7 Victor Hugo Odo

Doutor

Administradores
779 posts

Sexo:Masculino
Localidade:São Paulo - SP
Interesses:Compartilhar conhecimentos!

Posted 10/12/2009, 10:16

É isso mesmo. Não esqueça de colocar o condicional depois do CSS padrão para ele sobrescrever as propriedades aplicadas.

(ok2)

Fórum WMO - Administrador

#8 Kahor

12 Horas

Usuários
230 posts

Sexo:Masculino

Posted 10/12/2009, 10:23

Qual condicional O.O ?

#9 Victor Hugo Odo

Doutor

Administradores
779 posts

Sexo:Masculino
Localidade:São Paulo - SP
Interesses:Compartilhar conhecimentos!

Posted 10/12/2009, 10:38

O que eu te passei. rs
Tem que ficar nesta ordem para funcionar:

<head>
...
<link rel="stylesheet" type="text/css" href="css.css" />
<!--[if IE 7]>
<style>
body{
 background:#f00;}
</style>
<![endif]-->
...
</head>

[]'s

Fórum WMO - Administrador

#10 Kahor

12 Horas

Usuários
230 posts

Sexo:Masculino

Posted 10/12/2009, 10:44

Ah tá, hhahaha..

Deu certo!! Valeuzao, é que como eu nao conhecia essa 'técnica' fiquei meio boiando hehehe

Mas me fala uma coisa, qual a desvantagem de usar isso?

Pois em um outro site que fiz, a distancia da publicidade de 1 imagem para outra aumenta no IE7 e no IE8 FF e Opera está perfeita, url: www.cidadeinrevista.com.br/alimentacao

Ai se eu usar isso mais que umas 3x, o que pode acontecer?

#11 Victor Hugo Odo

Doutor

Administradores
779 posts

Sexo:Masculino
Localidade:São Paulo - SP
Interesses:Compartilhar conhecimentos!

Posted 10/12/2009, 11:03

Não é do o número de pixels que me referia. Na verdade não há problema algum em usar condicionais. Você pode colocar quantas e quais regras quiser. A questão é que quanto mais linhas, maiores são os arquivos. Então se você abarrotar o código com condicionais grandes, o browser consequentemente irá demorar mais para carregar a página. Fora que realmente é preferível criar códigos corretos.

Condicionais servem para ganharmos produtividade. Imagine só perder 2 ou 3 dias para ver por que 1 linha do CSS está dando problema.

Dê uma olhada neste artigo, explica bem sobre:

Artigo sobre hacks CSS

Bons ventos

(ok2)