Varmaan aika helppo juttu, mutta kun en ole pitkään aikaan xhtml:n ja css:n kanssa leikkinyt niin pääsi hiukan unohtumaan, enkä googlellakaan löytänyt vastausta.
Eli minulla on main-div jossa on vasemmlla linkit ja oikealla sisältö. Divit olen saanut vierekkäin, mutta jos vasemmassa divissä o enemmän sisältöä kuin oikeassa niin se menee main-divin yli.
Tässä omat räpellykseni:
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>moo</title>
<style type="text/css">
div.main {
border:2px solid green;
}
.left{
border:2px solid blue;
width:100px;
float:left;
}
.right{
border:2px solid red;
margin-left:120px;
}
</style>
</head>
<body>
<div class="main">
<div class="left">
<p>jotian</p>
<p>Ja viel jotain muuta</p>
</div>
<div class="right">
<p>jotain lisää</p>
</div>
</div>
</body>
</html>Sun pitää lopettaa tuo kellutus (float) jollain tapaa. Fiksumpiakin kikkoja varmaan wepistä löytyy, mutta itse olen tavannut käyttää ylimääräistä spacer-diviä. Eli main-divin loppuun (heti right-divin jälkeen) <div class='spacer'></div> ja css-määrityksiin div.spacer { clear: both; height: 1px; }.
Joo kiitti avusta, nyt näyttää toimivan. Löysin netistä sivun (http://nemesis1.f2o.org/aarchive?id=11) jossa näytti olevan asiasta, en kuitenkaan ehtinyt vielä sitä lukemaan.
Edit: toinen kysymys, miten saisi määriteltyä tekstille pistemäisen alleviivauksen? Ainakaan border:1px dotted color; ei tähän käy...
Noinhan se juuri tulee. Miksi moinen ei käy? Tosin Explorer taitaa näyttää pisteviivan katkoviivana, ainakin aikoinaan kun kokeilin. Pistemäinen siis dotted, katkoviiva dashed.
Aihe on jo aika vanha, joten et voi enää vastata siihen.