Witam. Dodam link do swojego kodu z kodem. Mam dwa problemy.
Chciałbym uzyskać pomoc z tym kodem, żeby to bardziej zrozumieć. Nie chce robić nowego kodu.
Wiesz, że dałeś mi mocną zagadkę? Najpierw chciałem napisać coś w stylu "sprawdź sobie w dev toolsach i ci pokaże, gdzie masz margines", ale jakoś nawet w dev toolsach tego nie wykazało (a ludzie się dziwią jak mówię, że CSS jest trudny).
Jednak twój kod jest bardzo chaotyczny, selektory są kompletnie brzydkie (np. ten ol>li>ul>li:hover a{ -- to jest złe, bo zakładasz na sztywno strukturę HTML i tego jakie znaczniki wrzucisz (nie będziesz mógł zmienić ol na coś innego. Swoją drogą czemu ordered list? Gdzie tam masz numery?). Lepsze podejście byłoby użycie klas CSS. No i ogólnie ten kod jest jakiś mocno partyzancki.
I tu dochodzimy do sedna, bo odkryłem, że jak zamienisz w definicji ol dla display: inline-block; na display: block; to automatycznie odstęp zniknie (nie wiem dlaczego, ale również nie wiem po co zrobiłeś tam display: inline-block. Efekt wydaje się być wypadkową twojego chaotycznego kodu i jakichś ukryt zasad CSS (been there, done that, najgorsze, że to jest samonakręcająca się spirala. Potem, żeby walczyć z CSSem, walisz jeszcze więcej chaotycznego kodu, a CSS kontraatakuje znowu jakimiś ukrytymi zasadami... i tak w koło macieju)
Kiedy najeżdzam (hover) na dany element menu to ten szary background rozjeżdża się razem rozwinięciem zagnieżdżonej listy, dlaczego?
to akurat jest najmniej tajemnicze, w końcu te elementy menu siedzą w pojemniku, któremu ustawiasz szary background.
trochę surowo, weź lepiej użyj skeletora czy miligrama, przy fontach powinieneś mieć chyba rozszerzenie latin-ext inaczej będą błędy przy polskich znakach ;)