Banner
Alternativní ukázka třísloupcového responzivního layoutu - tato stránka se na mobilních zařízeních s rozlišením do 1024px zobrazí automaticky bez sloupců, s horizontálním menu a vertikálně rozbalovacím hamburgerem (možné otestovat např. pomocí CTRL+kolečko na myši).

Výstupem na tiskárně je pak pouze obsah prostředního sloupce (viz náhled tisku v prohlížeči).

Tato třísloupcová varianta je řešena pomocí float: left u levého sloupce a float: right u pravého sloupce, detaily ve zdrojovém kódu.


Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut nec dui. Integer tortor wisi, adipiscing id, lacinia in, dapibus ut, leo. Suspendisse rhoncus sapien et est aliquam vulputate. Nam non nibh. Praesent posuere tortor at risus. Nam facilisis elementum elit. Quisque condimentum congue quam. Fusce fringilla malesuada lectus. Nam tristique, mauris eget faucibus ullamcorper, neque tellus elementum metus, sit amet iaculis pede leo eget diam. Proin malesuada, magna vel vehicula pretium, tortor ipsum ultricies augue, sit amet ultrices wisi ipsum non nulla. Fusce fringilla malesuada lectus. Nam tristique, mauris eget faucibus ullamcorper, neque tellus elementum metus, sit amet iaculis pede leo eget diam. Proin malesuada, magna vel vehicula pretium, tortor ipsum ultricies augue, sit amet ultrices wisi ipsum non nulla. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut nec dui. Integer tortor wisi, adipiscing id, lacinia in, dapibus ut, leo. Suspendisse rhoncus sapien et est aliquam vulputate. Nam non nibh. Praesent posuere tortor at risus. Nam facilisis elementum elit. Quisque condimentum congue quam. Fusce fringilla malesuada lectus. Nam tristique, mauris eget faucibus ullamcorper, neque tellus elementum metus, sit amet iaculis pede leo eget diam.