| Autor | Zpráva | ||
|---|---|---|---|
| Filipos Profil |
Zdravím, snažím se podle vzoru vytvořit layout, ale nedaří se mi, aby v divu "all" byly umístěny všechny další divy. Když jsem divu "all" nastavil border(red) a padding 10px, tak je vidět, že je ten rámeček jen okolo divu "header".
Díky za rady. Link zde: http://www.filip.nudaveskole.cz/ HTML a CSS <style>
body, p, ul, li {margin:0;padding:0;}
body {background:silver;}
#all {width:960px; margin:0 auto;}
#header {width:958px; height:118px;}
#menu {width:198px; height:200px;}
#content {width:679px; height:200px;}
#all {padding:10px 10px;}
#header {margin:0 auto;}
#menu {float:left; padding:20px;}
#content {float:left; padding:20px;}
#all {border:solid red 1px;}
#header {border:solid black 1px;}
#menu {border:solid yellow 1px;}
#content {border:solid blue 1px; border-left:none;}
#menu li {list-style:none;}
#menu li a {display:block; background:white;}
</style>
</head>
<body>
<div id="all">
<div id="header">
</div>
<div id="menu">
<ul>
<li><a href="index.html">Domu</a></li>
<li><a href="index.html">odkaz1</a></li>
</ul>
</div>
<div id="content">
</div>
<div id="footer">
</div>
</div>
</body> |
||
| Kubo2 Profil |
#2 · Zasláno: 5. 4. 2014, 23:35:28
Ty tie ostatné
<div>y naozaj máš vo vnútri <div>u #all, ale nastavil si im CSS vlastnosť float, a to je dôvod, prečo sa ti border zobrazuje iba okolo #header, ktorému si float nenastavil.
Ono totiž float urobí dve veci:
• nastaví prvku blokové zobrazenie (akokeby display: block),
• a vyjme ho z toku dokumentu, teda nastaví mu position: absolute
A to druhé je dôvod, prečo sa ti border zobrazuje tak, ako sa ti zobrazuje. (Prečítaj si niečo o absolútnom pozicovaní.) 
|
||
| Filipos Profil |
#3 · Zasláno: 6. 4. 2014, 00:52:58
Kubo2:
Dík, pochopil jsem a vyzkoušel jsem :) |
||
|
Časová prodleva: 10 let
|
|||
0