Da li br tag ima width?

[ dacha. @ 17.12.2010. 16:29 ] @

Verovatno prosta stvar za mnoge od vas, ali međutim ja znam rešenje problema ali ne razumem uzrok!
Naime, imam dva div-a, jedan u drugom, oba istih dimenzija (width=980px) ali dobija se poruka o grešci "Expanding Box Problem" (koji će istina uticati samo na IE6), poruka o greški se dobija u Dreamweaver CS5.

HTML kod:

Code:

<div id="vanjski">
           <div id="unutrasnji">
           </ div>
           <br class="clear" />
</ div>

CSS kod:

Code:

#vanjski{
           width:980px;
           margin:0;
           padding:0;
}

#unutrasnji{
           width:980px;
           float:left;
           height:150px;
           margin:0;
           padding:0;
}

.clear{
           clear:both;
}

Pitanje:
Zašto dobijam poruku o grešci kad oba div-a imaju isti width i treba da stanu jedan u drugi?
Onda sam na Firebug-u našao da element <br> ima width od 0.0166667px.
Zatim sam povećao width vanjskog div-a za 1px očekujući da neće opet prijavljivati "Expanding Box Problem", ali ne.
Da DW ne bi prikazivao pomenuti problem potrebno je width vanjskog div-a povećati za celih 17px (tako da bude width:997px;)?!?
Hteo bih da napomnem da i IE8 i FF pokazuju divove jedan u drugom bez problema ali mene interesuje da li element <br /> ima width kao što kaže Firebug ( i zašto baš 0,0166667px) i zašto je potrebno povećati baš 17px vanjski div da DW ne bi prikazivao poruku o grešci?

[ snake_master @ 17.12.2010. 16:38 ] @

Mozes umesto tog BR da koristis:

<div class="clear"></div>

mozda ce to resiti problem.

[ dacha. @ 17.12.2010. 16:49 ] @

To je zaista bio brz odgovor, svaka čast!
Jasno je meni kako može da se reši, na dosta načina..., ali otkud <br> tagu width od 0,0166667px od čega to zavisi,
on čak po Firebug -u ima i height, a provalio sam da mu je height isti kao i vrednost za line-height, što i ima smisla..

[ Aleksandar Ružičić @ 18.12.2010. 02:24 ] @

br je inline element, sto znaci da nema definisanu sirinu po defaultu.
s' druge strane, block elementi po defaultu popunjavaju sirinu svog parenta minus horizontalni padding parenta

[ dacha. @ 18.12.2010. 12:50 ] @

Upravo tako, ali:
Ako se umesto <br class="clear"> (u gornjem kodu) stavi <p class="clear">
tad neće biti poruka "Expanding Box Problem" JER <p> tad dolazi ispod unutrašnjog diva
a ne sa njegove desne strane kao <br> tag. Pa ako po defaultu <br> tag nema širinu zašto onda nastaje
"Expanding Box Problem" i zašto Firebug pokazuje širinu?
Svi elementi imaju za margin i padding nulu!

[ agvozden @ 18.12.2010. 19:18 ] @

Moze i

<br clear="all" />

[ Aleksandar Ružičić @ 21.12.2010. 01:35 ] @

iskren da budem, za sve ove godine koliko se bavim css-om nisam nijednom dosao u dodir sa tom "expanding box problem" greskom, mada <br /> nisam nikada koristio za ciscenje float-a..

u pocetku sam za to koristio <div class="clear"></div> gde clear klasa izgleda ovako: .clear { clear: both; } a kasnije sam poceo da koristim clearfix:

Code:

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: "x";
    clear: both;
    height: 0;
}
* html .clearfix { zoom: 1; }
*:first-child+html .clearfix { zoom: 1; }

dodas to u css i samo dodas clearfix klasu tom tvom "vanjski" div-u (tako ti ne treba dodatni markup da bi ocistio float)