Pojawiający się odstęp po wstawieniu obrazka jako tło + usunięcie scrolla.

Question

1.Po wstawieniu obrazka, jako tło pojawia mi się jakiś dziwny odstęp pomiędzy nav a content. Po usunięciu obrazka problem znika. O co może chodzić?

https://oskii2311.github.io/index.html

2. Jak pozbyć się scrolla z prawej strony?Wiem, że mogę dać overflow:hidden, ale wtedy po przybliżeniu nie będę mógł przewijać contentu.

3. Jakieś uwagi co do kodu ?

Z góry dzięki za pomoc.

Answer 1

1. Problem wynika z nakładania się marginesów (margin collapsing). W #content masz akapity tekstu (<p>), które mają niezerowe górne marginesy (zdefiniowane w domyślnych stylach przeglądarki). Te się nakładają na zerowe marginesy nadrzędnych <article> i <main id="content"> i powodują odstęp pomiędzy #content a #menu.

Można sobie z tym radzić na wiele sposobów, np. dać overflow: hidden czy display: inline-block dla #content czy dla tego <article> w środku. Albo wiele innych sposobów.

Comments

O to mi chodziło. Dzięki, nie wiem czemu sam na to nie wpadłem :)

Answer 2

Hej.

Mam uwagę do tła, 2,5 MB to stanowczo za dużo. I zmień kolor linków po :hover, jaskrawy zielony średnio pasuje.