[css] Diminuir A Espessura De Uma <hr>

[Guest - Amon-Rá_Beraldo -]

Como posso - se for possível - diminuir a espessura de uma <HR> com CSS?

Border e height aumentam/diminuem o espaçamento de HR em relação aos outros objetos.

Valeu

Abraço

[OSJunior]

Não intendi o que você deseja.

Coloque o código aqui para nós vermos.

[Beraldo]

É o seguinte: eu coloquei uma <HR> na página e mudei a cor dela com este código CSS:

<STYLE type=text/css> 
HR {
  color: #7F421C;
}
</STYLE>

Eu quero deixá-la mais fina, compreende? Eu posso fazer isso usando os sublinhados (___), mas quero saber se dá para faezr isso usando a prórpia HR.

[JCMPJ]

Que eu saiba não tem uma propriedade para mudar a espessura da HR.

HR é uma tag ultrapassada segundo W3C.

Por que você não usa uma borda?

[Beraldo]

Como assim "borda"? você quer dizer para usar uma tabela vazia? Só com as bordas?

Vou testar.

mas como deve ficar o código? assim não dá:

<table width="100%" height="1">

<tr>

<td style="border: solid 1px #7F421C">&nbsp;</td>

</tr>

</table>

[.Andreia.]

vê se é isso que você precisa:

<hr size="1">

[Beraldo]

Ah, tá zuando que era tão simples assim!! haha, e eu quebrando a cabeça aqui à toa...

É isso mesmo que quero fazer, Andréia! Muito obrigado!

Abraço

[.Andreia.]

legal ;)

[JCMPJ]

Mas não é CSS.

Pensei que você queria usar CSS.

[Beraldo]

Não é em CSS, mas já deu certo. É que eu não sabia que eu podia sar o size na tag HR.

Mas como você faria aquilo que você disse? Como seriam as "bordas" às quais você se referiu?

[Diego_Bittencourt]

bem, com css pelo que eu saiba (não uso muito hr's, por isso nem formato com CSS ^^) é só criar uma borda de 1px com height 1px.

hr {

border: 1px solid #000;

height: 1px

}

[JCMPJ]

Bom, isso depende o que vem antes e depois da linha que você quer.

Na pior das hipóteses, nada elegante eu usaria algo como:

<div style="width:100%;border-top:1px solid #7f421c"></div>

Ai coloca a espessura que você quizer 1,2,3px ... muda o tipo da linha, pode preencher com uma figura, só usar a imaginação.

[Beraldo]

São outras formas de fazer isso. Dão certo também.

Dá para escolher.. =)

Até Mais

Abraços

[Diego_Bittencourt]

Na pior das hipóteses, nada elegante eu usaria algo como:

<div style="width:100%;border-top:1px solid #7f421c"></div>

Você já disse tudo.

Usar Div (que é usada para estruturar o layout) no lugar de hr não é nada semântico. XD