Dresiranje divova? help

Web dizajn i grafika
1

evo slikice jedne u privitku.

Znaci imam u sredini dvije float kolone, i na dnu imam footer za koji želim da se miče kad se bilo koja od kolona povećava po visini (height). To sve radi…ali sad kad sam poželio farbati malo rubove…lijevo i desno (ovo što ova crvena boja bode u oči) …onda je došlo do problema koji se najbolje vide na slici…uglavnom ta pojavka crvene ispod kolona.

Pa kako bi to trebalo poslagati da bude izdresiranije?? Kako god okrenem, nešto zeza.

Logično mi je ovo: te dvije kolone su parkirane u ovako jednom divu koji ih centrira na sredini:

[HTML]
#columnBox
{
position:relative;
margin: 0px auto;
width:965px;
height:100%;
background-color:white;
}
[/HTML]

…ali neki mu vrag neda očito da se rastegne 100% kak očekujem…nevjerovatno mi je da je znači manji po visini od elemenata koje posjeduje (djece) :s

2

treba ti još jedan clearfix element, odnosno danas se to radi da dodaš npr. overflow: hidden. u taj tvoj element.

position: relative možeš maknuti, ne trebati.

3

Ne kuzim te, možeš li pliz pojasnit?

Clearfix ima što? …i koji element dobiva overflow: hidden; ?

4 
#columnBox
	{
	overflow:hidden;
	margin: 0px auto;
	width:965px;
	height:100%;
	background-color:white;
	}

Probaj tako.

clearfix element je element koji je sadržavao code clear:both i obično se stavljao nakon floatanih elemenata kako bi poništio floatanje.
Primjer:
HTML

<div class="container">
<div class="left">
<p>neki tekst</p>
<div class="clearfix"></div>
</div>

i CSS

.container
{
width: 960px;
margin: 0 auto;
}
.left
{
width: 50%;
float: left;
}
.clearfix
{
clear: both;
}

I da ti ja sada tu sve ne objašnjavam jer je to napisano 1000 puta evo link:
Force Element To Self-Clear its Children | CSS-Tricks
Lessons Learned Concerning the Clearfix CSS Hack : Perishable Press

5

aha, clear:both sam već imao…samo je falio ovaj overflow:hidden;

Izdresirani su sad :slight_smile: …hvala!

6

Sta tacno radi overflow:hidden?

7

Ako recimo imaš neki div box i odrediš mu visinu i širinu, a sadržaj unutar njega ne može stati onda koristiš overflow svojstvo kojem ćeš reći kako da to riješi. U ovom slučaju to je hidden koji će sakriti sadržaj koji prelazi izvan granice boxa.

8

Znaci ako u malom div-u ima mnogo texta > text se preliva preko div-a > overflow:hidden > i nema texta izvan div-a ?

9

Da ako je visina diva zadana (fiksna), ako nije onda se visina diva povećava da primi sav tekst. overflow hidden ti napravi to da sve što je unutar tog DIVa a viri van sa bilo koje strane bude nevidljivo izvan granica diva.

10

Baš tako.

11

Hvala!