Avatar billede jansangill Nybegynder
15. december 2005 - 12:33 Der er 6 kommentarer og
1 løsning

footer er altid i toppen, hjælp!

jeg har en hel masse css, men desværre kan jeg ikke placere min footer i bunden. Den viser sig altid i toppen.

Er der nogle der kan hjælpe mig?



herunder er mit css:

#news{
    position:absolute;
    height: 490px;
    width: 120px;
    background-color:#eee8ff;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #0099CC;
    border-right-width: 2px;
    border-right-style: solid;
    border-right-color: #CCCCCC;
    text-align: center;
    padding-top: 10px;
    top: 102px;
    left: 636px;
}

#menu_left{
    position:absolute;
    width:125px;
    height: 490px;
    top:102px;
    left:0px;
    background-color:#EEE8FF;
    text-align:left;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    color:#000000;
    border-top: #eee8ff;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #0099CC;
    font-size: 10px;
    border-left-color: #CCCCCC;
    border-left-width: 2px;
    border-left-style: solid;
    padding-top: 10px;
    padding-left: 5px;
    padding-right: 5px;
}

#mainbox_link{
    position:absolute;
    width: 455px;
    height: 490px;
    top:102px;
    left:140px;
    color:#000000;
    text-align: justify;
    padding-top: 10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    padding-right: 20px;
    padding-left: 20px;
}

#fotter{
    position:absolute;
    height:auto;
    width: 100%;
    left:0px;
    bottom:-500px;
    background-color:#0099CC;
    font-size:9px;
    color:#FFFFFF;
    z-index:99;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    border-right-color: #CCCCCC;
    border-bottom-color: #CCCCCC;
    border-left-color: #CCCCCC;
    text-align: center;
    border-right-width: 2px;
    border-bottom-width: 2px;
    border-left-width: 2px;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;

   
    }

#menu{
    position:absolute;
    font-size:10px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    color: #333333;
    height: 20px;
    width: 760px;
    background-color: #0099CC;
    text-align: center;
    padding-top: 2px;
    left:0px;
    top:80px;
}

#placeholder{
    position:absolute;
    width:760px;
    height:auto;
    margin-left: -380px;
    left:387px;
    top: 40px;
}

/* The rules for the header in the document */
#header {
    position:absolute;
    width:760px;
    height:75px;
    left:0px;
    top:0px;
    color:black;
    text-align:center;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    background-image: url(billeder/header.gif);

}



her er mit html til dette:

<div id="placeholder">
    <div id="header">
    </div>
   
   
    <div id="menu">
    <!--#include file="menu.txt"-->
    </div>
   
    <div id="menu_left">
    <!--#include file="menu_kurs.txt"-->
    </div>
   
    <div id="mainbox_link">
<%
    set uddTekst = server.CreateObject("scripting.FileSystemObject")
    set laesTekst = uddTekst.openTextFile ("d:\web\testmig.dk\www\hih\mir\Tekst\Kursister.txt")

    resultatet = ""
        Do While not laesTekst.AtEndOfStream
    resultatet = resultatet & laesTekst.ReadLine
        Loop
    laesTekst.Close
   
    resultatet = replace(resultatet,"•","<li>")
    response.Write(resultatet)
%>
    </div>
   
    <div id="news">
      <!--#include file="news.txt"-->
    </div>
   
        <div id="fotter">
    <!--#include file="fotter.txt"-->
    </div>
   
</div>
Avatar billede Slettet bruger
15. december 2005 - 14:05 #1
Her:
#fotter{
    position:absolute;
    height:auto;
    width: 100%;
    left:0px;
    bottom:-500px;

har du angivet, at den sklal placeres -500px fra bunden. Den skal laves om til et andet antal px fra toppen, i stedet for. ;-)
Avatar billede Slettet bruger
15. december 2005 - 14:08 #2
...vi alle sammen, har nemlig ikke samme skærmhøjder.
Og da al positionering foregår ud fra det øverste venstre hjørne (indtil andet er angivet), skal du også beregne dine placeringer ud fra dette punkt. Og i dit footer-tilfælde: Ud fra toppen.  ;-)
Avatar billede jansangill Nybegynder
15. december 2005 - 16:07 #3
denne -500 px er bare en nødløsning, i virkeligheden skal der slet ikke nævnes hvor langt den skal være fra toppen eller bunden. Det der skal være meningen er, at den skal være lige under alt content. dvs under alle andre <div id'er>.  Det skal være således at ligemeget hvad højden er på de andre, så skal footer bare altid placere sig under.

alt i alt var det bare en fejltagelse, at jeg tog denne denne linie med i eksemplen: bottom:-500 , glem den linie:D

har du en løsning på dette?
Avatar billede roenving Novice
15. december 2005 - 16:18 #4
Lad være med at bruge absolut placerede elementer !-)
Avatar billede jansangill Nybegynder
15. december 2005 - 16:20 #5
hehe 2 late, er alleede designet!:D
Avatar billede jansangill Nybegynder
15. december 2005 - 16:20 #6
hvis jeg gæør alt reletiv er der nogle andre problemer der kommer frem ve dhjemmesiden, som er større end det med footeren:S
Avatar billede jansangill Nybegynder
16. december 2005 - 15:12 #7
finder en anden løsning, elelrs mange tak for hjælpen
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