Diskuze: Optimalizace CSS

Naučíme tě pracovat na home-office.

Zjistit více...

Aktivity

Martin Bednář (xbedm01)

Tvůrce

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

Peco

Člen

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.