Avatar billede hoplaringen Nybegynder
05. januar 2012 - 14:30 Der er 15 kommentarer og
1 løsning

Div skal følge wrapper.

Kære Eksperter.

Hjæææælp.

hvorfor følger mine sider ikke indholdet?


<!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=UTF-8" />
<title>Untitled Document</title>
<style>
#mainwrapper {
    width:1011px;
    position:absolute;
    float:left;
    background:#fff;
    min-height:600px;
    height:100%;

}
#leftside{
    position:relative;
    float:left;
    width:18px;
    height:100%;
    background:#000;
   
    }
   
#rightside{
    position:relative;
    float:right;
    width:18px;
    height:100%;
    background:#000;
    }
   
#maincontent{
    position:relative;
    width:975px;
    float:left;
    background:#ccc;
}</style>

</head>

<body>
<div id="mainwrapper">           
            <div id="leftside">&nbsp;
            </div>
           
            <div id="maincontent">
            <br /><br /><br /><br /><br /><br /><br />1<br />2<br />3<br />1<br />2<br />3<br />1<br />2<br />3<br />1<br />2<br />3<br />1<br />2<br />3<br />1<br />2<br />3<br />
            </div>
           
            <div id="rightside">
            &nbsp;
            </div>     
    </div>
    <div style="clear:both"></div>
</body>
</html>


På forhånd tak.

Mvh
Peder
Avatar billede keysersoze Guru
05. januar 2012 - 14:59 #1
floatede elementer fylder ikke noget - det kan du fx løse ved at lave en div med clear: both

<div>
  <div style="float: left;">indhold</div>
  <div style="clear: both;"></div>
</div>
Avatar billede hoplaringen Nybegynder
05. januar 2012 - 15:31 #2
Hej Keysersoze.
Tak for hurtigt svar.
Har jeg placeret min clear both forkert?
Avatar billede keysersoze Guru
05. januar 2012 - 15:51 #3
ja og nej - du clearer mainwrapper hvilket kan være fint nok, men dine 3 elementer inden i mainwrapper float jo også og derfor skal de også cleares.
Avatar billede DeeDawg Nybegynder
05. januar 2012 - 16:05 #4
Det er fordi det ikke hjælper.
Du kan gøre det på denne måde dog:

<style type="text/css">
    #mainwrapper{
        width: 1011px;
        position: relative;
        overflow: auto;
        background: #fff;
    }
   
    #leftside{
        width: 18px;
        position: absolute;
        top: 0;bottom: 0;left: 0;
        background-color: #000;
    }
   
    #rightside{
        width: 18px;
        position: absolute;
        top: 0;bottom: 0;right: 0;
        background-color: #000;
    }
   
    #maincontent{
        margin: 0 18px;
        float: left;
        width: 975px;
        background-color: #ccc;
    }
</style>

Nu vil #maincontent bestemme længden på alle elementer inde i #mainwrapper. :)
Avatar billede hoplaringen Nybegynder
05. januar 2012 - 16:03 #5
øv øv, tror altså snart at jeg har stirret mig blind på det her.
Jeg har sat clear both ind alle steder, intet virker.
Avatar billede keysersoze Guru
05. januar 2012 - 16:14 #6
Selvfølgelig virker det - til det jeg svarer på. Det du svarer på er til gengæld noget andet, men det var ikke umiddelbart det jeg tolkede ud fra spm.
Avatar billede DeeDawg Nybegynder
05. januar 2012 - 16:19 #7
"Div skal følge wrapper."

- Vil godt vide, hvordan du kan få det til at fungere med din løsning. Alt din løsning gør, er at få hans wrapper til at følge alt det andet indhold, hvilket tydeligvis ikke er hans problem. :)
Avatar billede hoplaringen Nybegynder
05. januar 2012 - 16:31 #8
DeeDawg: Det var lige sådan jeg gerne ville have det. FEDT! Mange tak for hjælpe.
Svar, så du kan få points.
Avatar billede keysersoze Guru
05. januar 2012 - 16:31 #9
Jeg har ikke sagt at mit forslag løser spørgers problem - kun at det løser det problem jeg tolkede spørgsmålet som.
Avatar billede DeeDawg Nybegynder
05. januar 2012 - 16:36 #10
@keysersoze: Så tror jeg du skal have undervisning i at læse. :)

@hoplaringen: Det var så lidt. Der er rigtig mange der sidder med det her problem, men det er heldigvis let at løse. ;)
Avatar billede olebole Juniormester
05. januar 2012 - 17:03 #11
<ole>

@DeeDawg: Det er ikke utænkeligt, jeg også mangler nogle læsefærdigheder. Men så kan du jo sikkert elaborere lidt på begrundelserne for float på divet maincontent - og det efterfølgende div med clear  =)

/mvh
</bole>
Avatar billede keysersoze Guru
05. januar 2012 - 19:36 #12
og andre skal måske have undervisning i pli? hvis du nu læser  overskriften igen så står der intet om at det pågældende problem gælder flere divs, kun at der er problem med én div og derfor mener jeg stadig at mit svar sagtens kan tolkes som løsningen ud fra spørgers relativt simple forklaring, så fint nok at du kan læse mellem linjerne.
Avatar billede DeeDawg Nybegynder
06. januar 2012 - 21:36 #13
@keysersoze: Tog du virkelig den kommentar seriøst? Wtf.
Avatar billede keysersoze Guru
06. januar 2012 - 21:57 #14
ja - tænkte du skulle have lidt mere at ophøje dit ego med.
Avatar billede keysersoze Guru
06. januar 2012 - 22:03 #15
come on - kan du ikke tåle at der bliver stukket lidt til dig af samme skuffe som du går. Kom nu ind i kampen ;)
Avatar billede DeeDawg Nybegynder
07. januar 2012 - 05:02 #16
Dejlig originalt. :)
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