Avatar billede doctorking Nybegynder
02. marts 2004 - 12:18 Der er 4 kommentarer

Placering af div i bunden

Hej
Jeg har et problem med at få placeret en div centreret i bunden af en side. Det drejer sig om den div der hedder "bottomholder".
Her er min kode:

<html>

    <head>
        <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
        <title>CSS test</title>
        <style type="text/css">

body {
    text-align: center;
    margin: 0px;
    padding: 0px;
    background-image: url(img/bg_770.gif);
    background-repeat: repeat-y;
    background-position: center;
}

#content DIV {
    float: left;
}

#topholder {
    background-color: #777000;
    color:#009933;
    font-family:verdana;
    font-size:20px;
    width: 770px;
    margin-left:auto;
    margin-right:auto;
    text-align: left;
}

#main {
    color:#009933;
    font-family:verdana;
    font-size:20px;
    width: 770px;
    margin-left:auto;
    margin-right:auto;
}

#bottomholder {
    position: absolute;
    bottom: 5px;
    background-color: #779910;
    color:#009933;
    font-family:verdana;
    font-size:20px;
    width: 770px;
    align: center;
    float: none;
    }

#l {
    width: 150px;
    background-color: #884400;
    text-align: left;
}

#c {
    width: 400px;
    background-color: #fff111;
}

#r {
    width: 150px;
    background-color: #888000;
}
</style>

    </head>

    <body bgcolor="#ffffff">
           
            <div id="main">
                <div id="content">   
                    <div id="topholder">
                        top
                    </div>
                    <div id="l">
                        Boks 1 <br><br><br>
                    <table width="122" border="1" cellspacing="2" cellpadding="0">
                        <tr>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr>
                            <td></td>
                            <td></td>
                        </tr>
                    </table>
                    <br><br><br><br><br>
                    </div>
                    <div style="width: 20px">&nbsp;</div>           
                    <div id="c">Boks 2<br><br><br><br><br></div>   
                    <div style="width: 20px">&nbsp;</div>           
                    <div id="r">Boks 3<br><br><br><br><br></div>
                    </div>   
            </div>
            <div id="bottomholder">bottom</div>   
           
    </body>

</html>
Avatar billede swuppe Nybegynder
02. marts 2004 - 13:24 #1
da du fjerner diven fra det normale flow med position:absolute skal du centrere den seperat, prøv med:
#bottomholder {
    position: absolute;
    bottom: 5px;
    background-color: #779910;
    color:#009933;
    font-family:verdana;
    font-size:20px;
    width: 770px;
    left:50%;
    margin-left: -385px;   
    float: none;
    }
Avatar billede doctorking Nybegynder
03. marts 2004 - 09:45 #2
Ahh super. Tak for det. dog..hvis jeg sætter den til bottom: 0px; passer det i Netscape men i IE står den stadig en px for højt...(?)
Avatar billede doctorking Nybegynder
03. marts 2004 - 09:46 #3
og sætter jeg body'en til overflow: auto; forsvinder alt indhold i Netscape....
Avatar billede doctorking Nybegynder
03. marts 2004 - 09:52 #4
og bunden følger ikke med ned hvis man fylder tekst i div'sne... jeg opretter et nyt spg. (c: (http://www.eksperten.dk/spm/472472)
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