Dzień dobry.
Problem z jakim borykam się jest widoczny pod tym linkiem
Dla szerszego objaśnienia problemu. Responsywne warstwy, ta z buttonem PL/ENG i warstwą rozwiniętą po kliknięciu na button mają większą szerokość niż zielona warstwa pod spodem. Wysokość zielonej mogę zmieniać a szerokości siwej nie.
I za chiny nie mogę tego opanować. Luudzie poratujta trochę wójta 
rozwiązaniem?
Pozdrawiam.
Kod jest przekomblikowany. Da się to zrobić a nawet powinno być zrobione 100 razy prościej. Ten kod będzie trudny w rozwijaniu i utrzymywaniu. Poza tym miesza różne techniki (stare z nowymi) i chyba nawet jest tam inspiracja większymi projektami co tylko utrudnia czytelność całego kodu. Nazw class typu contai3 normalnie w kodzie się nie stosuje.
Dziękuję za uwagi
Że rozwieję trochę twoje wątpliwości. Jest to fragment górnej belki z mobilnym menu.
Nie przewiduję dalszej rozbudowy tego fragmentu. Pozycje do menu dodaje się w inny sposób. Jak pewnie zauważyłeś cały kod jest dla wersji mobile i desk, Po powiększeniu szerokości okna ponad 700 px „wskakuje” górna belka desktop bez menu mobilnego.Menu jest wtedy po lewej stronie i prawej.
W wersji mobile cała ta górna belka chowa się też po przewinięciu strony w dół, i pojawia się po niewielkim przewinięciu do góry. Nie dawałem tego efektu w jsfiddle by zbędnie nie gmatwać całości.
Według mnie takie podejście oszczędza wielkość kodu, a ewentualne zmiany wyglądu robi się w .css
Całościowa strona z taką górną belką w testach / mobile & desk / - /pagespeed insights, lighthouse i gtmetrix / osiąga ranking 91-94 (do 100 w wersji desk). Nie jest zatem chyba tak źle.
Jak byś rozwiązał - bez za dużych rewolucji - ten fragment dotyczący wymiarów siwego i rozwiniętego div’a ? Chodzi o szerokości coniatin4 i contain5.
Tylko te narzędzia nie analizują jakości kodu a ta jest niestety tragiczna.
Szczerze to nie mam pojęcia bo nie mam tyle czasu, żeby analizować ten kod w celu naprawienia tego zachowania. Jak wspomniałem mieszasz różne techniki - stare i nowe, dodatkowo niepoprawnie używasz float'ów które głównie powodują problem jaki masz. Mam wrażenie, że nie rozumiesz jak one działają, tak samo jak działa possition.
Kolejny problem jest taki, że masz tam strasznie dużo niepotrzebnych reguł css.
A no i brak czegoś takiego jak zerowania domyślnych styli CSS, co też powoduje takie zachowanie a nie inne.
Generalnie na Twój problem składa się szereg mniejszych i większych błędów, a nieczytelny kod CSS przez źle używane reguły oraz takie kompletnie nadmiarowe w połączeniu z złą strukturą HTML powoduje, że naprawienie tego wymaga dłuższego wgryzienia się w ten przykład.
Szczerze mówiąc szybciej byłoby napisać to od nowa z palca niż szukać dokładniej przyczyny w tym kodzie.
Być może ktoś będzie miał czas się pobawić, ja niestety nie mam na to czasu. Problem leży mniej więcej w (bo trzeba to dokładnie sprawdzić):
- braku zerowania styli CSS
- w niepoprawnie używanych
float'ach - prawdopodobnie nadmiarowo i źle używanych
possition - zmianie sposobu zachowywania się standardowych elementów HTML przez nadawanie im atrybutów
display - struktura HTML utrudnia uzyskanie efektów w menu jakich oczekujesz przez co trzeba się tak bardzo nakombinować
A no i mieszasz też xHTML z HTML 5. Jak już zaczynasz używać HTML 5 to warto byłoby go używać do końca.
Dziękuję za informacje
Trochę nie merytorycznie. Na kanwie tego co napisałeś przypomniało mi się mi stare łacińskie powiedzenie fines iustificare significat albo równoznaczne exitus acta probat. Prawda?
Korzystam też z innych, i te podstawowe błędy usuwam.
Skoro jesteś tak niechętny mojemu projektowi, bo dla bardziej doświadczonej osoby opanowanie tego jest chyba błahostką, więc nie zajmuję ci czasu.
Pozdrawiam
Nie zgadzam się.
Te narzędzia nie sprawdzą czy strona jest napisana logicznie, tylko czy jest poprawna ze standardem technicznym. Ale są też jakieś normy, standardy i konwencje tworzenia stron takie bardziej logiczne.
Kiedy miałem bardzo niewielką wiedzę w ogóle o komputerach padł mi stacjonarny i nie wiedziałem jak odpalić kompa z dyskietki. Dzwoniąc do fachofców dowiedziałem się że żadnego nawet naprowadzającego info nie dostanę , a jak już, to wtedy za dość $$.
Zawziąłem się i biorąc na logikę udaało mi się darmo to zrobić - bez łaski.
Tak i z tym problemem sobie poradziłem także strona ma lighthouse mobile rank 95, a
PageSpeed Insights tylko 93 . Temat do zamknięcia.
Ten temat został automatycznie zamknięty 180 dni po ostatnim wpisie. Tworzenie nowych odpowiedzi nie jest już możliwe.