html - Hvordan får jeg min div til at blive i bunden? - Udvikleren.dk

Tags: html css

<< < 1 2 > >>

Bruger #17259 @ 12.06.12 17:23

Hej allesammen

Jeg kunne godt tænke mig høre om der er nogen der ved hvordan man får en div til at blive i bunden af skærmen UDEN brug af procent på højden.

Her er min html.

HTML kode

 <html>
     <head>
     <LINK REL=StyleSheet HREF="style.css" TYPE="text/css"/>
         <title>testsite</title>
     </head>
     <body>
     <div id="container">
        <div id="headerbox">
         
        </div>
         <div id="middlebox">
             
         </div>
     </div>
         <div id="footerbox">
             
         </div>
     </body>
     
 </html>

Her er min CSS

CSS kode

 html, body{
     margin:0px auto;
     padding:0px;
     
     
 }
 
 #headerbox{
     background:#000000 url("images/headerbg.jpg") center no-repeat;
     height: 107px;
     margin:0px auto;
     padding:0px;
     
 }
 
 #middlebox{
     padding-bottom: 107px;
     
 }
 
 #footerbox{
     background:#000000 url("images/headerbg.jpg") center no-repeat;
     height: 107px;
     margin:0px auto;
     position: relative;
     margin-top:-107px;
     
 }
 
 #container{
     position:relative;
      min-height:100%;
      _height:100%;
     
 }

16 svar postet i denne tråd vises herunder
2 indlæg har modtaget i alt 7 karma

Sorter efter stemmer Sorter efter dato

Bruger #15754 @ 12.06.12 21:05

989

Min løsning er også 100% css. Virker helt ned til IE6 afaik. JSFiddle er bare et tool til hurtigt at vise en løsningen om det så er med eller uden javascript.

(Nu hvor jeg kigger på det site er det præcis det samme.)

Bruger #17260 @ 12.06.12 21:08

108

Oh - det havde jeg ikke tænkt over, jeg kiggede ikke lige på det, jeg tænkte bare at det var et smart værktøj der kunne håndtere efterspurgte. Dog er der forskel på absolute og fixed positionering - så nej, ikke helt det samme

Bruger #15754 @ 12.06.12 21:12

989

Det har du ret i, men teknisk set er der ingen forskel så længe #footerbox ikke er et under element af andet end body, havde den en anden parent ville den være positioneret absolute ift. den. Det ville fixed ikke, da den altid tager udgangspunkt i din viewport.