Avatar billede odsgaard Praktikant
01. juni 2011 - 11:43 Der er 5 kommentarer og
1 løsning

Baggrundsfarve i 3-spaltet layout

Hej Eksperter

Jeg sidder med et lille css problem.

Jeg har lavet en hjemmeside med 3 spalter. Hvis spalterne ikke er lige høje, så kan jeg se baggrundsfarven fra <body>. Hvordan løser jeg mit problem.

jeg har defineret en baggrundsfarve på "wrapper" og på <body>.

Jeg bruge 'float' for at placere de 3 div'er ved siden af hinanden. Hvordan får jeg "Wrapper" til at tilpasse sig størrelsens af div'ernes højde, så jeg kan bruge background-color på "wrapper" for at få ens baggrund på de 3 spalter.

/Brian

Eksempel:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
background-color:#FF0000;
}
#wrapper {
background-color:#FFFFFF;
width:80%;
margin-left:auto;
margin-right:auto;
}

#left, #center, #right{
width: 33%;
float:left;
}
-->
</style>
</head>

<body>

<div id="wrapper">
  <div id="content">
    <div id="left">
      <p>Left</p>
      <p>&nbsp;</p>
      <p>&nbsp;</p>
    </div>
    <div id="center">Center</div>
    <div id="right">
      <p>Right</p>
      <p>&nbsp;</p>
      <p>&nbsp;</p>
    </div>   
  </div
></div>

</body>
</html>
Avatar billede comodin Nybegynder
01. juni 2011 - 12:04 #1
sæt #content til float:left og giv denne baggrundsfarve... that could do the trick...
Avatar billede stenger Nybegynder
01. juni 2011 - 12:12 #2
Smid overflow:hidden; på din #wrapper

/Stenger
Avatar billede comodin Nybegynder
01. juni 2011 - 12:21 #3
;)  yeah well Stengers løsning er nok nemmere, du skal også lige definere bredde hvis du skal bruge det jeg skrev før...
Avatar billede odsgaard Praktikant
01. juni 2011 - 12:57 #4
Begge løsninger kan jeg bruge, så skulle i ikke dele points'ne

Takke for svarene :)
Avatar billede comodin Nybegynder
01. juni 2011 - 13:05 #5
svar herfra så...
Avatar billede stenger Nybegynder
01. juni 2011 - 13:29 #6
Bare giv points til comodin... de er mig ligegyldige :)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester