Problema com folha de estilo IE, Opera

neo_soro · Julho 8, 2007

Pessoal Boa Noite,

estou com um problema que em uma folha que estou fazendo. Estou começando agora no CSS e to com um probleminha.

Este é o site: http://oanalista.6te.net por favor vejam em mais de um navegador. Estou usando somente o IE e o Opera, mas acredito que no FF também vá ocorrer o mesmo problema.

O código CSS:

/* SinFORUM css style*/	td.menuon {		background-color:#F1AD4A;		cursor: hand;		font-family:Verdana, Arial, Helvetica, sans-serif;		font-size:12px;		font-weight:bold;	}		td.menuoff {		background-color:transparent;		font-family:Verdana, Arial, Helvetica, sans-serif;		font-size:12px;	}	#topo_header {		  background: transparent;		background-color:#4DEA58;		background-repeat:no-repeat;		  height: 200px;		  margin-right:0px;		margin-left:0px;			position:fixed;			width:100%;	}	#conteudo{		background:transparent;		background-position:center;		background-repeat:repeat;		background-color:#FEDFB1;		height:100%;		margin-bottom:0px;		margin-top:0px;		margin-left:0px;		margin-right:0px;		position:fixed;		width:70%;	}	#footer{		background: transparent;		background-color:#4DEA58;		background-repeat:no-repeat;		height:100px;		margin-right:0px;		margin-left:0px;		width:100%;	}O código HTML:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title><style type="text/css">	body{			margin-left:0px;		margin-bottom:0px;		margin-top:0px;		background-attachment:fixed;		background-repeat: no-repeat;		background-position: center;		background-position:top;	}</style><link href="estilo/estilo.css" rel="stylesheet" type="text/css" /></head><body>	<div id="topo_header">	<div>	<div id="conteudo">Teste</div>	<div id="footer"></div></body></html>

Agradeço a atenção, valeu.

RodrigoC

LeonardoBehnck · Julho 8, 2007

Pessoal Boa Noite,estou com um problema que em uma folha que estou fazendo. Estou começando agora no CSS e to com um probleminha. Este é o site: http://oanalista.6te.net por favor vejam em mais de um navegador. Estou usando somente o IE e o Opera, mas acredito que no FF também vá ocorrer o mesmo problema.O código CSS:/* SinFORUM css style*/ td.menuon { background-color:#F1AD4A; cursor: hand; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; } td.menuoff { background-color:transparent; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; } #topo_header { background: transparent; background-color:#4DEA58; background-repeat:no-repeat; height: 200px; margin-right:0px; margin-left:0px; position:fixed; width:100%; } #conteudo{ background:transparent; background-position:center; background-repeat:repeat; background-color:#FEDFB1; height:100%; margin-bottom:0px; margin-top:0px; margin-left:0px; margin-right:0px; position:fixed; width:70%; } #footer{ background: transparent; background-color:#4DEA58; background-repeat:no-repeat; height:100px; margin-right:0px; margin-left:0px; width:100%; }O código HTML:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title><style type="text/css"> body{ margin-left:0px; margin-bottom:0px; margin-top:0px; background-attachment:fixed; background-repeat: no-repeat; background-position: center; background-position:top; }</style><link href="estilo/estilo.css" rel="stylesheet" type="text/css" /></head><body> <div id="topo_header"> <div> <div id="conteudo">Teste</div> <div id="footer"></div></body></html>Agradeço a atenção, valeu.RodrigoC

Um dica:

margin-bottom:0px;		margin-top:0px;		margin-left:0px;		margin-right:0px;

Pode ser também

margin:0;

Mais simples não?Aqui eu não entendi porque você pediu pra repetir o fundo e alinhar ao centro?

background:transparent;		background-position:center;		background-repeat:repeat;		background-color:#FEDFB1;

Bem melhor:

background:#FEDFB1;

Não to criticando seu trabalho, apenas tentando ajudar ok?você pode economizar muitas linhas assim...Abraços http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

neo_soro · Julho 8, 2007

Um dica:
margin-bottom:0px;		margin-top:0px;		margin-left:0px;		margin-right:0px;
Pode ser também
margin:0;
Mais simples não?Aqui eu não entendi porque você pediu pra repetir o fundo e alinhar ao centro?
background:transparent;		background-position:center;		background-repeat:repeat;		background-color:#FEDFB1;
Bem melhor:
background:#FEDFB1;
Não to criticando seu trabalho, apenas tentando ajudar ok?você pode economizar muitas linhas assim...Abraços http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Obrigado pela ajuda LeonardoBehnck. Mas ainda não resolve meu problema. Algupem sabe como resolver? Me ajudem, por favor.

Giovani · Julho 8, 2007

Você pode dizer qual é o seu problema?Ou o que prentende fazer para que assim a gente possa tentar ajudar?

Paulo de Tarso F. M. · Julho 9, 2007

Bem melhor:
background:#FEDFB1;

Só uma correção aqui... LeonardoBehnck, a propriedade background deve ser utilizada quando você tem mais de uma propriedade para formatar seus planos de fundo... Da maneira que você citou, está incorreto... Se você quer definir somente a cor de fundo, o mais adeqüado é utilizar o background-color mesmo... Agora, se você tivesse que formatar a cor de fundo e aplicar uma imagem também, aí sim utilizaria o background para "economizar"... Ok?

Abraço!

neo_soro · Julho 9, 2007

Você pode dizer qual é o seu problema?

Ou o que prentende fazer para que assim a gente possa tentar ajudar?

Oi gio!, como eu disse anteriormente estou começando a me aventurar no CSS. Bom, o que queria fazer era: criar umas "divs" e trabalhar como se fossem tabelas. Estou tendo algumas dificuldades, porque dependendo do navegador, as "divs" ficam diferentes. Queria saber como que eu faço para ajeitar isso. Tipo para não mudar o "jeito" como elas ficam. Eu to até conseguindo (com muito esforço), mas acho que to utilizando uma método muito "braçal". Tipo eu pego crio as divs, por exemplo, #header_topo, #header_logo. E configuro os espaços delas assim tipo: margin-left:96px; tipo isso. Acho que fica muito ruim. Não existe nenhum material, ou tuto que explique isso melhor, como trabalhar com o css e as divs. Obrigado desde já.

RodrigoC

Paulo de Tarso F. M. · Julho 9, 2007

Bom, com a palavra do gio! (não sei se era algo mais ou menos assim que ele diria, mas provavelmente ele se proncunciará a respeito também), para começar, você tem que esquecer o conceito de tabela...

Pára tudo!

Antes a gente fatiava uma imagem para montar nosso layout e fazia isso com tabelas... É assim que trabalham os softwares gráficos: Fireworks, Photoshop, etc. Mas eles têm suas razões para isso... Mas isso não significa que o site tem que ser montado dessa forma... Ou melhor, não tem que ser montado dessa forma! O que deve ser feito é: se a imagem tem que ser fatiada, tudo bem, a fatie, mas na hora de colocar tudo no (X)HTML, isso tem que ser montado da maneira correta, e não com tabelas...

O trabalho é braçal sim. Infelizmente hoje não temos nenhum software que trabalhe de maneira visual e que gere um código semanticamente correto (além de limpo)... Se você utiliza o Dreamweaver por exemplo, utilize apenas o modo code, esquece o design. Não tem jeito! Eu uso esse software e é dessa forma que trabalho, tudo na mão mesmo...

Outra coisa: quando você aprender a trabalhar corretamente com o CSS e com a marcação (X)HTML, verá que não é tão complicado quanto parece no início... Mas para chegar lá você terá que estudar bastante, isso sim...

Ah! Pela sua descrição, me parece que você está trabalhando com muito position: absolute (sim, pois se você está utilizando valores altos para margin ou padding, normalmente isso acontece quando temos que deixar uma div ou qualquer outro elemento em uma determinada posição na página, e não pode ser outra, por isso arrisquei esse palpite, mas caso não for, tudo bem também... rsrsrs). E uma página bem estruturada com uso do CSS adequado não precisa ser montado dessa forma... Se você quiser, dê uma olhada nos materiais disponíveis em nosso Laboratório de Scripts (WS). Lá temos tutoriais que ensinam a montar uma página com uso correto do CSS e do próprio XHTML, além de um outro que mostra como funcionam as propriedades margin, border e padding.

Boa sorte! Qualquer coisa, é só perguntar!

Abraço!

Guilherme Rambo · Julho 9, 2007

De fato quando mudamos nossa metodologia de trabalho devemos pensar diferente... pensar nas divs como células de tabelas não é o mais adequado[]'s

neo_soro · Julho 10, 2007

Bom, com a palavra do gio! (não sei se era algo mais ou menos assim que ele diria, mas provavelmente ele se proncunciará a respeito também), para começar, você tem que esquecer o conceito de tabela...

Pára tudo!

Antes a gente fatiava uma imagem para montar nosso layout e fazia isso com tabelas... É assim que trabalham os softwares gráficos: Fireworks, Photoshop, etc. Mas eles têm suas razões para isso... Mas isso não significa que o site tem que ser montado dessa forma... Ou melhor, não tem que ser montado dessa forma! O que deve ser feito é: se a imagem tem que ser fatiada, tudo bem, a fatie, mas na hora de colocar tudo no (X)HTML, isso tem que ser montado da maneira correta, e não com tabelas...

O trabalho é braçal sim. Infelizmente hoje não temos nenhum software que trabalhe de maneira visual e que gere um código semanticamente correto (além de limpo)... Se você utiliza o Dreamweaver por exemplo, utilize apenas o modo code, esquece o design. Não tem jeito! Eu uso esse software e é dessa forma que trabalho, tudo na mão mesmo...

Outra coisa: quando você aprender a trabalhar corretamente com o CSS e com a marcação (X)HTML, verá que não é tão complicado quanto parece no início... Mas para chegar lá você terá que estudar bastante, isso sim...

Ah! Pela sua descrição, me parece que você está trabalhando com muito position: absolute (sim, pois se você está utilizando valores altos para margin ou padding, normalmente isso acontece quando temos que deixar uma div ou qualquer outro elemento em uma determinada posição na página, e não pode ser outra, por isso arrisquei esse palpite, mas caso não for, tudo bem também... rsrsrs). E uma página bem estruturada com uso do CSS adequado não precisa ser montado dessa forma... Se você quiser, dê uma olhada nos materiais disponíveis em nosso Laboratório de Scripts (WS). Lá temos tutoriais que ensinam a montar uma página com uso correto do CSS e do próprio XHTML, além de um outro que mostra como funcionam as propriedades margin, border e padding.

Boa sorte! Qualquer coisa, é só perguntar!

Abraço!

Boa noite Paulo de Tarso F. M., obrigado pelas dicas. Eu sempre fazia meus sites pelo modo code, mas o que acontece é que eu via que os sites ficavam muito pobres visualmente e com o CSS é melhor de trabalhar e como ainda não sei direito tava mechendo mesmo pelo modo design. Bom vou mesmo estudar pq vi que pode ser mais trabalhoso, mas é muito mais fácil trabalhar assim, apesar do trabalho de dá (rsrsrsrs). Bom como disse obrigado pela dica, mas me responde uma coisa: aqui em casa eu fiz e o IE ficou normal, o FF ficou tudo "doido" e pedi para um amigo meu entrar no site e ver... e lá fica tudo torto, tanto no IE, como FF. Como eu ajeito isso? Porque dá essa doidisse?

Desde já agradeço muito.

RodrigoC

Paulo de Tarso F. M. · Julho 10, 2007

Então meu caro neo_soro, essas "doidices" fazem parte mesmo... Infelizmente... Mas uma dica que irá te ajudar bastante: nunca se baseie pelo IE... O IE tem muitos bugs... Você acha que está certo nele, mas na verdade ele está é te enganando... Procure acertar pelo Firefox ou pelo Opera... Quase sempre a renderização nesses dois últimos são iguais, só uma coisinha ou outra que acaba dando um trabalho maior de vez em quando, mas nem se compara com a "dor de cabeça" que é consertar os bugs do IE... Quando você conseguir aprender o que são as webstandards de verdade, como utilizar o CSS corretamente, você vai ver que tudo o que você está enfrentando hoje será motivo de "revolta" própria depois... É, você olha pra trás e não acredita em certas coisas que fazia antes... Mas é assim mesmo...

Ok? Boa sorte com seus estudos! E precisando de apoio, tamo a e...

neo_soro · Julho 10, 2007

Então meu caro neo_soro, essas "doidices" fazem parte mesmo... Infelizmente... Mas uma dica que irá te ajudar bastante: nunca se baseie pelo IE... O IE tem muitos bugs... Você acha que está certo nele, mas na verdade ele está é te enganando... Procure acertar pelo Firefox ou pelo Opera... Quase sempre a renderização nesses dois últimos são iguais, só uma coisinha ou outra que acaba dando um trabalho maior de vez em quando, mas nem se compara com a "dor de cabeça" que é consertar os bugs do IE... Quando você conseguir aprender o que são as webstandards de verdade, como utilizar o CSS corretamente, você vai ver que tudo o que você está enfrentando hoje será motivo de "revolta" própria depois... É, você olha pra trás e não acredita em certas coisas que fazia antes... Mas é assim mesmo...

Ok? Boa sorte com seus estudos! E precisando de apoio, tamo a e...

Pow Paulo de Tarso F. M., valeu a atenção cara. Fui no Laboratório de Scripts, que apesar de ser sobre CSS vi coisas importantes que nem sequer sonhava no HTML. Que é a questão da padronização. Muita gente se confunde, pois pensa que HTML, por ser visual não há uma padronização por trás (tipo eu rsrs). Mas pra te falar mais a verdade fiquei um pouco confuso. XHTML é a mesma coisa que HTML só que melhorado, ou é um padrão totalmente distinto dele? Tipo comecei a ler e estava falando sobre a tag DOCTYPE e tals. Só mais um pergunta: faz diferença se eu colocar em vez de Transitional para Strict. Se não for pedir muito tu poderias me dizer somente a diferença básica entre HTML, XHTML, XML e a diferença entre um DTD Strict e um Transitional. É isso que modifica a forma como o "browser" vai interpretar o meu código? E se eu mudar só isso os navegadores irão aceitar os meus CSSs.

Beasho, desde já agradeço sua atenção. Valeu.

RodrigoC

p.s.: realmente a Microsoft é um @#$!@. Em todos os lugares que eu li falavam: "Para se basear não use o IE. É cheio de bug". Estou até pensando em desistalar o windows e começar a usar o Linux rsrsrsrs.

Paulo de Tarso F. M. · Julho 10, 2007

Então neo_soro, XHTML é a linguagem HTML melhorada. Na verdade, é a substituição do antigo HTML.

http://forum.imasters.com.br/public/style_emoticons/default/seta.gif O que é XHTML?

O XHTML, ou eXtensible Hypertext Markup Language, é uma reformulação da linguagem de marcação HTML baseada em XML. Combina as tags de marcação HTML com regras da XML; este processo de padronização tem em vista a exibição de páginas Web em diversos dispositivos (televisão, palm, celular, etc). A intenção é melhorar a acessibilidade.

O XHTML consegue ser interpretado por qualquer dispositivo, independentemente da plataforma utilizada, pois as marcações possuem sentido semântico para as máquinas. O HTML não consegue esta implementação. No entanto, não existem muitas diferenças entre o HTML e o XHTML. Para verificar se uma página XHTML está bem construída, o melhor método é validar o código através numa aplicação Web disponibilizada pela W3C.

Existem atualmente três versões do XHTML:

[*]XHTML 1.0 - Transitional, Strict, Frameset e Basic

[*]XHTML 1.1

Existe uma outra variedade de XHTML 1.1, a Basic, que atualmente está em desenvolvimento.

[*]XHTML 2.0 - Em desenvolvimento

O XHTML 1.0 tornou-se uma recomendação do World Wide Web Consortium (W3C) no dia 26 de janeiro de 2000.

Fonte: Wikipédia

http://forum.imasters.com.br/public/style_emoticons/default/seta.gif O que diferencia um doctype Strict de um Transitional?

Bom, ao utilizar um DTD Strict tenha certeza de que sua marcação XHTML esteja correta, sem erros. Esse tipo de DTD não oferece suporte a algumas tags do antigo HTML, que segundo o W3C estão em desuso. O termo muito comum para essas tags obsoletas é que elas são Deprecated. HTML 4.01 / XHTML 1.0 Reference.

O Transitional ainda permite algumas tags mesmo que estejam em desuso. Eu não recomendo. Tenho a opinião de que se é para trabalhar dentro dos padrões, se algumas tags estão em desuso, então não é para utilizá-las. E ponto.

Eu nem utilizo o XHTML 1.0 Strict. Para você ter uma idéia, utilizo o XHTML 1.1, que nem Transitional tem, ele é apenas e TOTALMENTE Strict, mas use se você REALMENTE quer um código livre de qualquer tipo de erro. Realmente mesmo. Um simples ; no lugar errado pode gerar uns 5 ou 6 erros na validação. Mas quando se está acostumado com as webstandards, o desenvolvimento padronizado vira automático.

http://forum.imasters.com.br/public/style_emoticons/default/seta.gif O que é XML?

Veja a descrição na Wikipédia. Eu não manjo de XML, por isso nem vou arriscar falar sobre isso (sei "por cima", mas é melhor ocultar minha opinião para não falar besteira).

Agora, quanto a deixar de utilizar o Windows, essa é uma escolha sua. Mas lembre-se que ainda o Internet Explorer é o browser mais utilizado no mundo, então não adianta, você terá pelo menos que testar suas páginas nele para não ter dores de cabeça...

Boa sorte! Abraço!

Arquivado

Problema com folha de estilo IE, Opera

Recommended Posts

neo_soro 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

LeonardoBehnck 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

neo_soro 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Giovani 104

Compartilhar este post

Link para o post

Compartilhar em outros sites

Paulo de Tarso F. M. 24

Compartilhar este post

Link para o post

Compartilhar em outros sites

neo_soro 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Paulo de Tarso F. M. 24

Compartilhar este post

Link para o post

Compartilhar em outros sites

Guilherme Rambo 4

Compartilhar este post

Link para o post

Compartilhar em outros sites

neo_soro 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Paulo de Tarso F. M. 24

Compartilhar este post

Link para o post

Compartilhar em outros sites

neo_soro 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Paulo de Tarso F. M. 24

Compartilhar este post

Link para o post

Compartilhar em outros sites

printf iniciante básico

JAVA - Orientação para Invalidar Sessão

JAVA - Ajuda em Paginação

Fóruns

Tempo Real

Informação importante