NOVINKA - Online rekvalifikační kurz Java programátor. Oblíbená a studenty ověřená rekvalifikace - nyní i online.
NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!
Avatar
Martin Bednář (xbedm01)
Tvůrce
Avatar
Martin Bednář (xbedm01):5.12.2013 19:14

Ahoj kolegové,
chci se zeptat, jestli vás nenapadá jednodušší způsob pro vytvoření rozložení stránky jako v přiloženém obrázku, než

CSS:
#content0,#header0,#left-banner0,#right-banner0{padding:0px;margin:0px;float:left;}
#header0{width: 100%;}
#header{height:200px;border: 5px solid black;}
#left-banner0,#right-banner0{width:20%;}
#content0{width:60%;}
#left-banner,#right-banner,#content{border: 5px solid black;height: 500px; padding:3px;}
HTML:
        <div id="header0">
            <div id="header">
              hlavička
            </div></div>
        <div id="left-banner0"><div id="left-banner">Levý banner</div></div>
        <div id="content0"><div id="content">Obsah</div></div>
        <div id="right-banner0"><div id="right-banner">Pravý banner</div></div>
Odpovědět
5.12.2013 19:14
I bez motta se dá žít
Avatar
Peco
Člen
Avatar
Odpovídá na Martin Bednář (xbedm01)
Peco:5.12.2013 19:27 
<body>
 <header>hlavicka</header>
 <div class="page">
  <nav>lavá strana</nav>
  <article>obsah</article>
  <aside>prava strana</aside>
 </div>
  <footer>paticka</footer>
</body>

// CSS
body {background:#FFF;margin:0px;padding:0px;}
header, footer, div.page {width:100%; max-width:960px;clear:both;margin: 0 auto;}
nav, aside {width: 15%;max-width:150px;float:left;}
article {width:70%;max-width:660px;float:left;}

takto by to mohlo ísť pomocou HTML 5

Editováno 5.12.2013 19:30
Nahoru Odpovědět
5.12.2013 19:27
Každý deň vstávam, aby som sa niečo nové naučil.
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 2 zpráv z 2.