Wystające marginesy

pytanie zadane 2 marca 2018 w HTML i CSS przez KonDZIKs Bywalec (2,770 p.)

Witam :)
Mam dosyć dziwny problem którego nie rozumiem.
Otóż jak widać na załączonym obrazku
https://iv.pl/images/08436392093442219709.png
w miejscu gdzie jest menu przy "stronie głównej" wystaję z lewej i od góry chyba margines nie jestem pewny a przy reszcie jest normalnie. A co dziwne gdy wrzuciłem kod tutaj https://codepen.io/Kondzik/pen/MQLJaW wystaje tylko z lewej strony a reszta jest normalnie. :/ Proszę o pomoc. :)

komentarz 2 marca 2018 przez Bazinga Bywalec (2,120 p.)
edycja 2 marca 2018 przez Bazinga

.menu > li > ul {
	list-style-type: none;
	weight: 40px;
	height: 40px;
	background-color:orange;
}

Co to jest za właściwość weight: 40px?

I <ul> w środku <li>? Chyba powinno być odwrotnie.:)

komentarz 5 marca 2018 przez KonDZIKs Bywalec (2,770 p.)

Dziękuję już wszystko poprawione :D

1 odpowiedź

odpowiedź 2 marca 2018 przez Kamil Łydka Stary wyjadacz (13,600 p.)

Jeśli dobrze rozumiem o co Ci chodzi, to wystaje Ci padding, a nie margin. Margin tylko robi "odstęp" pomiędzy konkretnymi elementami, a padding działa wewnętrznie, przez co tło wystaje.

Każdy twój element ma lewy padding. Możesz to łatwo sprawdzić: Prawym przyciskiem myszy f12 -> elements, znajdujesz w kodzie swoje ul lub klikasz ten kursor na skraju paska (niedaleko zakładki Elements) i wybierasz element na stronie -> przechodzisz do zakładki Computed i masz tam ładnie wszystko zaznaczone, co wystaje, jakie są marginesy, paddingi itp.

Przypuszczam, że ustawienie paddingu na 0 dla wszystkich elementów tutaj nie wystarczy, bo domyślam się, że chciałeś tym sposobem zrobić przerwę pomiędzy konkretnymi pozycjami menu. Zauważ, że pierwszy element nie potrzebuje paddingu w lewą stronę, bo nie ma po lewej stronie żadnego kolegi.