Čo sa mení

Všimnite si, že chýba <meta name="viewport" content="width=device-width, initial-scale=1">znak , ktorý deaktivuje aspekt priblíženia stránok v mobilných zariadeniach. Okrem toho sme obnovili šírku nášho kontajnera a zmenili navigačnú lištu, aby sme zabránili zrúteniu, a v zásade je to dobré.

Čo sa týka navigačných panelov

Ako upozornenie, komponent navbar je tu dosť zložitý v tom, že štýly na jeho zobrazenie sú dosť špecifické a podrobné. Nahradenia, aby sa zabezpečilo, že zobrazenie štýlov pracovnej plochy nebude také výkonné alebo elegantné, ako by ste chceli. Uvedomte si, že pri používaní navigačného panela môžu nastať potenciálne problémy, keď staviate na tomto príklade.

Prehliadače, posúvanie a pevné prvky

Nereagujúce rozloženia zvýrazňujú kľúčovú nevýhodu pevných prvkov. Akýkoľvek pevný komponent, ako napríklad pevná navigačná lišta, sa nebude dať posúvať, keď sa výrez zmenší ako obsah stránky. Inými slovami, vzhľadom na šírku kontajnera, ktorá nereaguje na 970 pixelov a zobrazovanú oblasť 800 pixelov, potenciálne skryjete 170 pixelov obsahu.

Neexistuje žiadny spôsob, ako to obísť, pretože je to predvolené správanie prehliadača. Jediným riešením je responzívne rozloženie alebo použitie nepevného prvku.

Nereagujúci mriežkový systém

Jedna tretina
Jedna tretina
Jedna tretina