[CSS] Pozioma linia Opcje

[aeaeae]

Może pytanie wydaje się banalne, ale męczę się nad tym już jakiś czas. Jak zrobić w IE (ja mam akurat IE6, ale myślę, że w późniejszych wersjach jest podobny problem) poziomą linię (niech będzie, że na całą szerokość) o wysokości dokładnie 1px. Próbowałem hr i div, ale zawsze wychodzi wysokość 2px mimo, że daję height:1. Zorientowałem się, że w IE blok nie może mieć mniejszej wysokości niż jedna linia czcionki dlatego daję font-size:0.

Naprawdę nie rozumiem czemu jest z tym aż taki kłopot. Nie chcę przecież nic innego jak dać na stronie element blokowy (obojętnie już jaki), który będzie miał jakiś tam mój kolor i wysokość 1. Tylko tyle.

HTML

[HTML] pobierz, plaintext 
costam
<div class="line"></div>
costam
[HTML] pobierz, plaintext 

CSS

[HTML] pobierz, plaintext 
*{margin:0;padding:0}
.line{height:1;font-size:0;background-color:#FF0000}
[HTML] pobierz, plaintext 

[aeaeae]

Dzięki. Chyba zrobię po prostu tak, że dam div (nad tym miejscem, w którym planowałem linię) z border-bottom: 1px solid #FF0000. Lepsze by było rozwiązanie z hr, bo blok powyżej mógłbym modelować z większą swobodą (np. margin w takim wypadku odpada - muszę zagnieździć kolejnego div), ale mimo zerowania marginesów i obramowania hr w IE wciąż ma jakieś pozostałości po kilka px u góry i dołu (gdy zaznaczam kursorem w przeglądarce).

Może ktoś inny ma jeszcze jakąś propozycję?

"Dlaczego ustawiasz height na 1?"
Chcę mieć po prostu linie oddzielające tekst. Jakiś margines sobie dołożę potem, ale linia ma mieć właśnie 1px i tu jest problem, bo gdy już będę chciał wszystko dokładnie ułożyć, to w Firefoxie i IE będzie to inaczej wyglądało ze względu właśnie na ten dziwny dodatek do hr w IE.

Ten post edytował aeaeae 16.05.2011, 17:28:24