Olá galera!
Primeiramente, deixa eu me apresentar, meu nome é Fernando e estou (re)começando a mexer com desenvolvimento web.
Eu estou fazendo um site pruma namoradenha e to com 1 problema que acho que não seria necessário utilizar nenhum hack css, porém não consigo identificar o erro.
A cada etapa tenho testado no FF e no IE6.
Fui criar uma linha de divisão no layout usando div's e um quadrado de fundo. Configurei a div com 1px e no FF aparece certinhu do jeito que eu queria, mas no IE esse 1px de altura fica gigante...aih fiquei pensando se não falta a inclusão de algum charset/encode ou eu to viajando e tals...
bom...vou postar o código tanto da HTML quanto do arquivo CSS e se não for muito incomodo, uma solução pra isso
[codebox]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR...nsitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Grupo Ideal</title>
<link href="css.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="head"></div>
<div id="main">
<div id="menu">
<div id="line_one"></div>
<ul>
<li><a href="#">Página Inicial</a> | </li>
<li><a href="#">Quem Somos</a> | </li>
<li><a href="#">Programação</a> | </li>
<li><a href="#">Boletim Informativo</a> |</li>
<li><a href="#">Fale Conosco</a></li>
</ul>
<div id="line_two"></div>
</div>
<div id="left"></div>
<div id="right"></div>
<div id="rodape"></div>
</div>
</div>
</body>
</html>[/codebox]
[codebox]@charset "utf-8";
* {
margin:1px;
padding:0;
}
#container {
background-color: #FFFFFF;
margin: 0px auto;
padding: 0px;
height: 552px;
width: 800px;
border: 1px solid #39B54A;
}
#head {
background-image:url(imagens/logo.jpg);
margin:0 auto;
padding: inherit;
height: 123px;
width:inherit;
}
#main {
background-image:url(imagens/bg_main.jpg);
background-repeat:no-repeat;
margin:0 auto;
padding:0;
width:800;
height:428px;
}
/* MENU DE NAVEGAÇÃO */
#menu {
padding:0;
left: 90px;
float:left;
}
#menu ul {
list-style:none;
position: static;}
#menu ul li {
display:inline;}
#menu ul li a {
font: 10pt "Trebuchet MS", Tahoma, "Times New Roman", sans-serif;
font-weight:bold;
color:#000000;
text-decoration: none;}
#menu ul li a:hover {
font: 10pt "Trebuchet MS", Tahoma, "Times New Roman", sans-serif;
font-weight:bold;
color:#339933;
text-decoration: underline;}
#line_one {
background-image: url(imagens/color_line.jpg);
width: 779px;
height: 1px;
float:right;
margin: 0;
padding:0;
}
#line_two {
background-image: url(imagens/color_line.jpg);
width: 505px;
height: 1px;
float:left;
margin: 0;
padding:0;
} [/codebox]
Charsets E Encodes P/ Ie6
Started By MiNuZ, 03/09/2008, 13:07
3 replies to this topic
#1
Posted 03/09/2008, 13:07
#2
Posted 03/09/2008, 17:26
Está viajando. Se quer fazer só uma linha, <hr>, ora. Depois CSS nela.
------
No caso ali, as linhas poderiam até ser bordas do #menu. border-top e border-bottom.
------
No caso ali, as linhas poderiam até ser bordas do #menu. border-top e border-bottom.
Edição feita por: LeoB, 03/09/2008, 17:28.
#3
Posted 04/09/2008, 08:52
vlw leo,
Mas de qualquer maneira, tem uma linha perdida depois da linha que não consigo tirar..substitui o div pelo HR, mas não sei os atributos CSS pra modificar ela...a cor, o posicionamento...pode me dar uma mão??
Com o atributo DIV acabei conseguindo deixar ela do jeito que queria usando o atributo background-repeat: repeat-x;
Agora no HR, apliquei Width, height, color e nenhum desses atributos apareceu nem no IE e nem no FF...
Sei que são duvidas bestas..mas se puder dar uma mão...
O principal é o espaço que ficou entre a linha e o ínicio da ul...
Mas de qualquer maneira, tem uma linha perdida depois da linha que não consigo tirar..substitui o div pelo HR, mas não sei os atributos CSS pra modificar ela...a cor, o posicionamento...pode me dar uma mão??
Com o atributo DIV acabei conseguindo deixar ela do jeito que queria usando o atributo background-repeat: repeat-x;
Agora no HR, apliquei Width, height, color e nenhum desses atributos apareceu nem no IE e nem no FF...
Sei que são duvidas bestas..mas se puder dar uma mão...
O principal é o espaço que ficou entre a linha e o ínicio da ul...
#4
Posted 04/09/2008, 09:50
Não tem mesmo muita coisa pra ser feita nela. O que não pode é você usar uma div vazia só pra fazer uma linha. Isso é inaceitável.
Se com o hr não ficar do jeito que você quer, usa borda no #menu então. É até melhor.
<style type="text/css"> hr { border: none; background-color: #6699FF; margin: 0 auto; width: 70%; height: 1px; }</style>Mais informações aqui: http://www.sovavsiti.cz/css/hr.html
Se com o hr não ficar do jeito que você quer, usa borda no #menu então. É até melhor.
1 user(s) are reading this topic
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)