Re: HR i CSS3 - Grupy dyskusyjne w eGospodarka.pl

eGospodarka.pl › Grupy › pl.comp.www › HR i CSS3 › Re: HR i CSS3

Data: 2012-02-07 18:37:45
Temat: Re: HR i CSS3
Od: Marek <p...@s...com> szukaj wiadomości tego autora
[ pokaż wszystkie nagłówki ]
Dnia Mon, 06 Feb 2012 22:45:22 +0100, NotBear napisał(a):

> W dniu 2012-02-06 18:19, Marek pisze:
>> Konsekwentny? :-) Tam nie mówiliśmy o HR lecz o P, Hx, DIV. To po pierwsze.
>
> Wymieniales jeszcze UL oraz "itp". HR nature ma blokowa, wiec dlaczego
> go nie wlaczyc do grona "itepow"? :-)

Dlatego ponieważ HR służy do rozdzielania graficznego elementów treści. Co
mi z elementu, w którym nie da się ustawić obu odległości (od góry i od
dołu)? Swoją drogą dobry argument do porzedniego wątku pokazujący
absurdalnośc mechanizmu collapsingu. Marginesy są po to aby mieć możliwość
ich użycia, a tu idą one w rozwalenie layoutu i to w zupełnie innym miejscu
strony.
>
>> A po drugie jak zapewnić w takim przypadku odstęp od góry? Chyba raczej się
>> nie da...
>
> Proponowales, cytuje: "generalna zasada: zerujemy górne marginesy
> elementp P, Hx, UL itp i ustawiamy dolne. Wszystko będzie wyglądać jak
> należy."

Heh.. owszem i generalnie tak to czynię. No ale co to za argument? Czego ma
dowodzić? Tego, że jest jakiś element, dla którego powyższa łata nie działa
(bo potrzebujemy górnego marginesu)? No jest, i próbuję coś z tym zrobić
:-)

Collapsing znów atakuje a ja próbuję się bronić szukając kolejnej łaty -
specjalnej dla HRów.

> Ja proponuje szybko zapomniec o tej "zasadzie", zaufac collapsingowi i
> cieszyc sie spelniajacym Twoje wymagania HRem w postaci jaka
> przytoczyles - z oboma marginesami.

Nie da rady - w tym sęk. Podawałem nawet przykład tego w poprzednim wątku.
Collapsing przenika przez elementy po to aby wypłynąć w "przypadkowym"
miejscu layoutu. Nagle ni z gruszki ni z pietruszki dostajesz odstęp miedzy
elementami, które nigdy go wcześniej nie miały zanim ktoś gdzieś dalej w
kodzie zastosował HR. Powtórzę ten przypadek poniżej.

>>> Lepsze rozwiazanie mozna zaproponowac widzac caly kod, teraz to wrozenie
>>> z fusow.
>> Tylko co masz na myśli? Każdą możliwą kombinację elementów z HR ?
>
> Nie. Wystarczy ta, ktora spowodowala, ze rozjechal Ci sie layout. Ale
> wraz ze wspomnianym layoutem. Wtedy bedzie mozna wykombinowac niepsujace
> rozwiazanie.

Ok, oto obiecany wcześniej przypadek (w uproszczeniu). W praktyce ten HR
może wystąpić w różnych miejscach layoutu. Sam layout zawiera więcej
podobnych sekcji. Mało tego - mogą powstać nowe i w założeniu HR w nich nie
ma dokonywać destrukcji. Jak tego dokonać inaczej niż Cezary radził? Nie
wiem.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
body {
margin: 0;
padding: 0;
}
hr {
margin-top: 50px;
}
</style>
</head>

<body>
<div style="background-color:#F00">ten DIV jest odsunięty od następnego
gdyż 'bąbelkował' górny margines HR</div>
<div style="background-color:#009900">
<hr>
bla bla bla
</div>
</body>
</html>

Załózmy, że DIVy są elementami layoutu. Usuń HR a DIVy zaczną ładnie
przylegać. Pewnie zaproponujesz rozwiązanie aby w drugim DIVie ustawić
padding górny na 1 px i przesunąc DIVa o 1px po to aby zniwelować ten
niepotrzebny padding. Zapomnijmy o takim rozwiązaniu - jest chore. Powstaną
tylko kolejne problemy.