HTML i BODY robią se jaja

HTML i BODY robią se jaja
Freja Draco
Freja Draco
  • Rejestracja:około 7 lat
  • Ostatnio:ponad 3 lata
  • Postów:3394
1

Jeśli to nie dość merytoryczny temat, to proszę o przeniesienie gdzieś indziej, bo w sumie nie pytam o rozwiązanie, tylko wyrażam wkurzenie i zdziwienie. No chyba, że ktoś potrafi przedstawić logiczne uzasadnienie dla poniższych obserwacji. Na marginesie wątku:
Problem z właściwością margin
poeksperymentowałam trochę i zaobserwowałam takie kuriozalne przypadki:

1 HTML i BODY mają ramki i kolory tła, czyli niby widać gdzie są, ale żółte tło elementu HTML rozlewa się na całe okno przeglądarki, czyli gdyby ktoś chciał poznać jego rozmiar i położenie w oparciu o kolor tła, to niczego sensownego się nie dowie :(
1

2 HTML i BODY mają ramki, BODY ma też tła, i jego kolor tła ponownie rozlewa się na całe okno i j.w. :(
2

Może jest to jakieś ułatwienie przy pokrywaniu strony tłem, ale gwałci logikę i spójność zasad. No i przeszkadza w połapaniu się co gdzie jest, zwłaszcza, że reguły kolapsowania marginesów sprawiają, że po dodaniu border element może zacząć zachowywać się inaczej niż bez nich, więc jak ktoś do inspektora nie zajrzy i nie wie o tej bombie, to może pół dnia się nad czymś wściekać.

3 Przykład nawiązujący do kolapsujących marginesów z przytoczonego powyżej wątku. HTML ma widoczną ramkę, BODY ma kolor tła rozlany na całe okno. Element BODY podświetlony w inspektorze razem z jego systemowym marginesem (margines podświetlony na żółto).
Jak widać BODY zaczyna się dopiero wraz z pierwszym DIV-em zawierającym jakąś treść (#b - czerwony). Można to zmienić i przywrócić mu logiczne zachowanie, nadając mu jakiś border.
Podobny los spotkał skolapsowanego DIV-a wyższego poziomu (#a - zielony).
Przy czym kolapsacja dotyka tylko marginesów pionowych.
3

No dobra, po spędzeniu kilku godzin na analizowaniu tego i eksperymentowaniu mogę powiedzieć,że chyba rozumiem jak to cholerstwo działa i a nie tylko wiem, jak się pozbyć głupiego efektu. Ale nie rozumiem po co? Po jakiego chińskiego boga ktoś wydumał sobie tak nielogiczne, niespójne i pełne wyjątków zasady dodawania marginesów? :/

css


edytowany 2x, ostatnio: Freja Draco
czysteskarpety
czysteskarpety
  • Rejestracja:około 10 lat
  • Ostatnio:ponad 4 lata
  • Lokalizacja:Piwnica
  • Postów:7697
0

Obecnie nikt się tym raczej nie podnieca ponieważ we froncie jest naprawdę sporo roboty i funkcjonalności do zrobienia.


Freja Draco
Freja Draco
Też z tym jakoś żyłam przez kilkanaście lat i nawet wiedziałam, jak to obchodzić, ale przez lata myślałam, że to jest po prostu jakiś bug w CSS a dzisiaj postudiowałam, żeby zrozumieć i złapałam się za głowę.
YO
  • Rejestracja:ponad 11 lat
  • Ostatnio:prawie 3 lata
  • Postów:540
0

Temu się robi:

Kopiuj
body {
margin: 0;
padding: 0;
}

i nic się nie dzieje.

w ogóle to można mieć na to ...
bo 90% kodu przeglądarki to poprawianie błędów webmasterów .... :) nie ważne, że się źle CSS napisze, ma działać :D

https://www.kirupa.com/html5/make_body_take_up_full_browser_height.htm


Dziura w ścianie gdzie Panowie widzą Panie,
Rick and Morty, season 1.
Szukam tej dziury, jak coś dajcie znać gdzie jest :D "A z Ciebie c**** pisowski" - Ula Papuszko (w sensie, że JA) 05.06.2020 r., grupa: Strajk Przedsiębiorców. Witam zatem, jestem c**** pisowski ;)
edytowany 2x, ostatnio: youmound
Zobacz pozostałe 7 komentarzy
YO
No nie bardzo - HTML zawsze ma 100% wielkości, stąd widzisz jego kolor tła na 100% okna. Przecież okno przeglądarki ma swoją wielkość niezależnie od wycinka pola dla użytkownika..
Freja Draco
Freja Draco
@youmound: wpisz sobie HTML {background-color:yellow; border:1px solid green;} i zobacz, co zobaczysz.
YO
nie zobacze nic czego się nie spodziewam zobaczyć: https://jsfiddle.net/ku9q57ag/ nawet teraz mimo ograniczonego bloku, cały content ma swój rozmiar
Freja Draco
Freja Draco
@youmound: Pisałeś "HTML zawsze ma 100% wielkości", a na powyższym przykładzie gołymi oczami widać, że nie. Potwierdza to inspektor: element BODY > wyliczone wartości CSS > width:150px; height:100px; a zatem zgodne z zadeklarowanymi i pokazywanymi przez ramkę elementu. A kolor tła rozlewa się poza rozmiary elementu na całe okno. Jeżeli ty tego nadal nie widzisz / nie rozumiesz, to się poddaję.
YO
pisałem kilka razy, że nie mamy wpływu na wielkość obiektu HTML, skoro jak sama widzisz - jego obszar i tak wychodzi poza ramkę :)

Zarejestruj się i dołącz do największej społeczności programistów w Polsce.

Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.