Autor Zpráva
xlifer
Profil
Proč se mi v uvedeném příkladu nepřizpůsobí obsah DIVu "obal" vnitřku?
Nemůžu zadat height do obalu, protože bude text různě dlouhý a chci,
aby se autmaticky výška DIVu obal přizpůsobovala.

Kde dělam chybu?

<style type="text/css">

.obal {
display: block;
border: 1px solid #ff0000;
}

.box {
float: left;
width: 200px;
height: 100px;
margin-left: 7px;
padding: 0px;
background: #888888;
}

</style>

<div class="obal">

<div class="box">
<a href="#1">odkaz1</a><br>
text1<br>
</div>

<div class="box">
<a href="#2">odkaz2</a><br>
text2<br>
</div>

</div>
Bubák
Profil
Chybí ti "čistič".
Jak funguje „float“ a „clear“
xlifer
Profil
Když tedy přidám čistič, tak pravda se vyřeší situace.

hr.cistic {
   clear: both;
   height: 1px;
   border: none;
   margin: -1em 0 0 0;
   visibility: hidden;
   }


Ale co nechápu přesně je, jaké všechny parametry musí čistič obsahovat?
Většinou tam je zadané vše height, border, margin, atd.
To nestačí pouze clear: both; a visibility: hidden; ?
xlifer
Profil
A je lepší používat čistič přes tag <HR> nebo <DIV> ?

<HR class="cistic">


?

<DIV class="cistic"></DIV>


HR je samozřejmě kratší zápis, ale je tam ještě nějaký jiný rodzíl nebo doporučení proč to používat s HR nebo DIV?

Díky za odpovědi.
Davex
Profil
Stačí pouze nastavení vlastnosti clear: both. Tím zbytkem se zneviditelňuje ten horizontální oddělovač <hr>. Použití prázdného elementu je v mnoha oblastech praktičtější. Někdo používá jako čistič i <br>, ale v nějakém historickém prohlížeči to dělalo problémy.

Ještě existuje jedna metoda, která se ale nehodí vždy, protože ji doprovázejí nějaké vedlejší efekty:
.obal {
  overflow: hidden;
}
xlifer
Profil
Díky moc mi pomohlo zde uvedené rady.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0