Diskuze: Optimalizace CSS

HTML a CSS HTML a CSS Optimalizace CSS American English version English version

Avatar
Martin Bednář (xbedm01):

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:
<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  +1 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.