Padding rozciąga element

Padding rozciąga element
WW
  • Rejestracja:prawie 10 lat
  • Ostatnio:prawie 10 lat
  • Postów:5
0

https://jsfiddle.net/wx2fw3mh/3/

Dlaczego zmiana paddingu div.menu z 0px do 1px rozciąga div.menu? Spodziewałem się, że:

  • div.menu powiększy się o 1px w każdym kierunku.
  • zostanie dodany 1px pomiędzy "granicą" div.menu, a

    .

dzek69
Moderator
  • Rejestracja:ponad 18 lat
  • Ostatnio:około 2 miesiące
  • Lokalizacja:Rzeszów
0

Magia css-a.
Związane jest to z tym, że <p> jest pierwszym elementem w <div> i posiada (domyślnie) jakiśtam margin-top. Wtedy tło rodzica szaleje (sprawdź sobie na tłach-obrazkach). Nie wiedziałem, że jak dodamy do tego padding u rodzica to robi się jeszcze większa magia ;)

Skoro wszystkie przeglądarki powielają ten schemat - zapewne ma to swoje logiczne wyjaśnienie - trzeba by było szukać w opisach standardów W3.

margin-top first element w Google daje sporo rezultatów, może tam naprędce znajdziesz dlaczego tak jest.


edytowany 1x, ostatnio: dzek69

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.