3 kolonner. Alle skal ha' samme højde

Tags:    html css

Hej, jeg sidder, og arbejder på et nyt design til min hjemmeside. Det er bygget op med en stor hvid boks i midten, med en skygge ude i hver side.

Det hele virker fint, undtagen lige de der skygger. De skal nemlig ha' samme højde som den div-boks hvor teksten er i.

Skyggerne er en div-boks med en baggrund i. Alt teksten er også inde i en div-boks. Så det jeg har gjort er at jeg har smidt (endnu) en div-rundt om de 3, og sat højden af skyggen til at være 100%. Tekstkassen udvider sig bare, alt efter hvor meget tekst der er i den.

Her er et screenshot, for at forklare det lidt bedre(boksenes id står ud for): http://i47.tinypic.com/x0rxgy.jpg
og et lille eksempel, på hvordan jeg har sat det op.
Fold kodeboks ind/udKode 


Problemet

Problemet er at skyggerne bare forsvinder når jeg sætter den til at være 100% i højden.
Hvordan får jeg skyggerne til at være lige så høje som tekstboksen?

Kode
HTML: http://pastebay.com/78206
CSS: http://pastebay.com/78207

ps. php-funktion base_url() som der bliver brugt i html-koden, returnerer bare adressen til ens webside(http://localhost/svendbenno i mit tilfælde. )




Indlæg senest redigeret d. 23.12.2009 18:36 af Bruger #14210
Er du sikker på du ikke bare vil have en baggrund på din wrapper som indeholder dine skygger samt et hvidt billede i midten? (Din hvide baggrund)



Hrmm. Skyggen går fra en næsten sort til transparant. Er det muligt at få den hvide baggrund til at stoppe(altså ikke fylde det hele)?



Men hvordan kan det være at jeg ikke bare kan sætte deres højde til 100%, så de vil tage samme højde som boksen de er i?

Skal jeg sætte et eller andet på parent-boksen?



...Og hvad skulle 100% så betyde? 100% af hvad? den container du har lagt den i har du jo ikke givet en højde - hvordan skal dit CSS så vide hvad højden er?

Kort sagt: du skal give højde på alle dine elementer, ellers ved du jo ikke hvor høje de er - det ser ud til du gør det med bredde, men hvorfor så ikke også med højden :-)





Så løste jeg det. Hvorfor jeg ikke havde tænkt på den her ide før, aner jeg ikke. Jeg gjorde det at jeg lave et billede der var 1000 pixels bredt og 1px højt. Der lagde jeg så bare skyggerne og baggrunden sammen. Så smed jeg det bare som baggrund til min wrapper, og wupti. Det virker ^^



t