Ok nu har jag försökt att använda div'ar och css för att bygga upp min site men jag blir inte klok på detta.
Nu ska vi se om jag kan förklara detta på ett vettigt sätt.
Det jag vill ha är tre stycken kolumner som ligger brevid varandra och jag vill att det ska bete sig som en tabell med samma uppbyggnad hade gjort.
Skulle jag användt en tabell så hade jag satt en höjd på tabellen till 100px. Sen om någon av kolumnerna skulle innehållit mer information än det som hade täckts upp av dessa 100px så skulle tabellen vuxit neråt. Bakgrundsfärgen på tabellkolumnerna hade då naturligtvis följt med på alla tre kolumnerna.
Detta sker dock inte med koden jag har nedan. Varför förstår jag inte riktigt. Något annat som jag inte riktigt greppar är varför den beter sig olika i Iexplorer, Firefox och Opera. Jag misstänker att det har något med floats och det faktumet att jag vill ha tre div'ar brevid varandra att göra men kan inte lista ut en lösning.
I Explorer så expanderas #container så som jag tänkt utifrån storleken på innehållet. Dock så hänger inte #center som har ett kortare innehåll med hela vägen ner.
I firefox så hänger inte divarna med alls och likadant i Opera.
Hjälp någon? :)
Resultat av nedanstående kod: http://www.jonne.net/wf.html
<!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">
#container
{
position:absolute;
border: 2px double red;
height: 100px;
}
#left
{
border: 1px solid black;
width: 200px;
height:100px;
background-color:#99CC99;
float:left;
position:relative;
}
#center
{
border: 1px solid black;
width: 200px;
height:100px;
background-color:#993333;
float:left;
position:relative;
}
#right
{
border: 1px solid black;
width: 200px;
height:100px;
background-color:#3399FF;
float:left;
position:relative;
}
</style>
</head>
<body>
<div id="container">
<div id="left">
Ulla feum nostrud ercin volum Ulla feum nostrud ercin volum dolobore do odignit nulla consequat landiam,
velesse quissequis exer init ut acip endre conum vel etueraesent praese dolore facilluptat ullut aciduis et,
commy nullummy nim augueros nit ad modolore feuipis endignit lute commodolor sit nonummy nulla core dolorper
ad delis ad dolorem elis dio do ex esed exer ilit, se magnisi smoluptat, vero odolesenis num dolorperosto eros
eugait la consenim aliquam, quisi. Amcore do odo consendre cortie faccum dolobore consectem autem quat.
</div>
<div id="center">
Ulla feum nostrud ercin volum Ulla feum nostrud ercin volum dolobore do odignit nulla consequat landiam,
velesse quissequis exer init ut acip endre conum vel etueraesent praese dolore facilluptat ullut aciduis et,
commy nullummy nim augueros nit ad modolore feuipis endignit lute commodolor sit nonummy nulla core dolorper
ad delis ad dolorem elis dio do ex esed exer ilit, se magnisi smoluptat,
</div>
<div id="right">
Ulla feum nostrud ercin volum Ulla feum nostrud ercin volum dolobore do odignit nulla consequat landiam,
velesse quissequis exer init ut acip endre conum vel etueraesent praese dolore facilluptat ullut aciduis et,
commy nullummy nim augueros nit ad modolore feuipis endignit lute commodolor sit nonummy nulla core dolorper
ad delis ad dolorem elis dio do ex esed exer ilit, se magnisi smoluptat, vero odolesenis num dolorperosto eros
eugait la consenim aliquam, quisi. Amcore do odo consendre cortie faccum dolobore consectem autem quat.
</div>
</div>
</body>
</html>