Autor Zpráva
Radovan789
Profil *
Jestli se nepletu tak CSS by si mělo počítat defaultně šířku podle obsahu, proč tedy když nezadám šířku elementu tak se mě to roztáhne jak kdybych zadal width: 100% ? Jdá se to opravit? Jinak obsah může být jakkoliv široký proto nechci zadávat pevnou šířku.

Takhle vypadá můj zápis:
.box {
  height: 24px;
  background: #30322c;
}
Fisir
Profil
Reaguji na Radovana789 [#1]:
Pokud je to blokový element, automaticky zabere celou šířku.
Radovan789
Profil *
Fisir:
Děkuji za odpověď. A lze jiným způsobem udělat to aby šířka byla určena podle obsahu? O blokový element se jedná. Jestli je to co chci vůbec možné (v rámci CSS).
Fisir
Profil
Reaguji na Radovana789 [#2]:
.box  {
    display: inline-block;
}
margin
Profil *
Fisir:
Pokud je to blokový element, automaticky zabere celou šířku.
Jsou výjimky, při floatování a při pozicování, schválně jsem je dal na začátek.

Radovan789:
Jestli se nepletu tak CSS by si mělo počítat defaultně šířku podle obsahu
Jednak se pleteš, druhak se šířkami elementů to není jednoduché a v CSS specifikaci je tomu věnována celá kapitola 10.3 Calculating widths and margins
float: left; /* ve většině případů nejvhodnější */
position: absolute; /* ne vždy se hodí, element je vytržen toku dokumentu */
display: inline-block; /* IE6/7 udělají inline block jen z inline elementů, takže box uděláš třeba ze SPANu */
display: table; /* IE6/7 neznají */
display: table-cell; /* IE6/7 neznají */
Fisir
Profil
Reaguji na margina [#5]:
float: left; /* ve většině případů nejvhodnější */
Mě se naopak nejvíce osvědčil ten inline-block, protože při složitějších layoutech se to s floatem začne sypat.
Radovan789
Profil *
margin, Fisir:

Děkuji pánové :)
panther
Profil
Fisir:
protože při složitějších layoutech se to s floatem začne sypat.
otázka je, jestli je chyba ve floatu, nebo v kodérovi. Přikláním se k druhému.

Mě se naopak nejvíce osvědčil ten inline-block
z blokového elementu nebude fungovat všude, jak už tu jednou padlo.

Radovan789:
jmenuje se to (má třídu) „box“, tak bych už podle jména očekával blokový element. Asi máš blbě pojmenovanou třídu, řádkový box si moc dobře představit neumím.

Jinak jaké řešení bude nejlepší nelze obecně říct, každé se hodí pro jinou situaci. Pro nalezení nejlepšího řešení bys musel ukázat skutečný příklad, o němž se můžeme bavit.
Gappa
Profil
Ten mýtus o tom, že v IE6/7 nejde udělat inline-block z např. div nebo li, se tu stále traduje? :)

.inline-block        {
   display: inline-block;
   =display: inline;
   =zoom: 1;
}

A je hotovo. Zatím jsem s tím nenarazil na problém - ale to ho nevylučuje v nějakých speciálních situacích.
Tremono
Profil
[#9] GappaCo přesně to dělá?

(Já to teď řešil, a nechal si s inline-block ostylovaný divy prohnat browsershots.org, a správného výsledku se dočkal jen u IE10 - vše starší mi to seřadilo pod sebe.)
preca1
Profil
Tremono:
Funguje to..
A u zoom ten znak bejt nemusí.
margin
Profil *
Tremono:
správného výsledku se dočkal jen u IE10 - vše starší mi to seřadilo pod sebe
Musels někde mít chybu, ale podle symptomů nedokáži poznat, jakou.
Moderátor Chamurappi: Tremono řeší svůj problém vedle.

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: