Autor Zpráva
jefitto44
Profil
Mám 3 stlpce v responsive dizajne. Dva sidebary - pravý a ľavý a hlavný content, kde sa zobrazuje text tej-ktorej podstránky. Problém nastáva, keď floatovanie pri responsive dizajne ruším. Vtedy sa stlpce usporiadajú tak, že 1,2 a 3. Ja by som ale potreboval zobraziť stlpce v poradi 2,1,3, čiže najprv by sa zobrazil content a až pod nim sidebary... ako sa to dá docieliť?
anonymníí
Profil *
jefitto44:
Uveď elementy v daném pořadí už v HTML.
jefitto44
Profil
Potom mi zas nebude fungovať floatovanie... Vyzerá to takto
1 (sidebar)------ 2 (main)------ 3(sidebar)
1- float left
2- float left
3- float right

Ak by som najprv floatoval (2) a až pod tym floatoval (1), tak by výsledný efekt bol
(2)--------(1)---------(3)
anonymníí
Profil *
jefitto44:
Tři sloupce, kde obsah má být uprostřed a zároveň v kódu nahoře, je základní kodérská dovednost.

Hledej, anebo lépe, zkus na to přijít sám.
jefitto44
Profil
mám to prerobiť na positiony nebodaj?
anonymníí
Profil *
jefitto44:
mám to prerobiť
Ano.

na positiony
Ne.
radekt
Profil
Já na to používám FlexBox.
html:
<div id="obal">
<div id="obsah"></div>
<div id="levy"></div>
<div id="pravy"></div>
</div>

CSS:
/* malé displeje */
#obal { display: flex; flex-direction: column;}
#pravy, #obsah, #levy { width: 99%; }
#pravy { order: 1; }
#obsah { order: 3; }
#levy { order: 2; }

/* větší displeje */
@media all and (min-width: 600px) {
#obal { display: flex; flex-direction: row;}
#pravy, #obsah, #levy { width: 33%; }
#pravy { order: 1;}
#obsah { order: 2;}
#levy { order: 3;}
}

Až na nižší verze MSIE to funguje: MSIE 8 neumí ani media queries, ani Flexbox, MSIE 9 již umí media queries, ale neumí Flexbox. Těm pak podsouvám styl s float modelem pomocí podmíněných komentářů - a počítám jen s desktopem, na mobilních prohlížečích asi těchto prohlížečů moc neběží. Píšu to zpaměti, tak tam snad nemám chyby, neuvádím také vendor prefixy.
jefitto44
Profil
Ďakujem za pomoc. Funguje všetko. Toto potrebujem len na responsive, takže IE ma neinteresuje. Hádam nikto na mobile nepoužíva IE 8
Kcko
Profil
Stáhni si respond.js
jefitto44
Profil
Neviem to používať...v javascripte som rád, že viem použiť už hotové riešenia zatiaľ...
jefitto44
Profil
Ako teraz urobím pomocou tých orderov, keď chcem dať v responsive dva sidebary vedľa seba (riešim väčšie rozlíšenie)? Ak obidvom sidebarom nastavím order:2, aj tak to nefunguje

Vaše odpověď

Mohlo by se hodit

Odkud se sem odkazuje


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: