Gå til innhold

Container følger ikke med "etter" 100%

Flurry

Av Flurry
i Programmering og webutvikling

Anbefalte innlegg

Flurry

Flurry

Skrevet
Skrevet (endret)

Hej.

 

Har et ganske så stort problem.

 

Har satt høyden på main diven til 100%, men den forblir ikke 100% etterhvert som jeg får mer innhold i content diven.

 

URL: http://home.no.net/fefas/

 

Hjelp ? =/

 

På forhånd takk ! :)

 

Emnetittel redigert. "Følger ikke med =/" er dårlig bruk av emnefeltet. Vennligst ta en titt

på hva nettiketten sier om dette, og prøv å lage en mer beskrivende emnetittel neste gang. PoleCat.

Endret av PoleCat
Lenke til kommentar

Videoannonse

Videoannonse
Annonse
Flurry

Flurry

Skrevet
  • Forfatter
Skrevet

Når jeg putter inn innhold i content diven, så følger ikke main diven med. Main diven skal lure folk til å tro at navigation og de andre divene følger med etterhvert som jeg får mer innhold i content diven.

 

Problemet er at det skal set ut som det er 100% høyde, men etterhvert som jeg får mer innhold så følger ikke main diven med. Den skal alltid være 100% i høyden !

 

Hjelp ? =/

Lenke til kommentar
mohuhau

mohuhau

Skrevet
Skrevet (endret)

Dette kommer av at du bruker absolutt posisjonering.

Siden koden din egentlig var veldig tung og du hadde mye unødvendig har jeg endret koden din en del slik at det blir slik du vil :)

<!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>Izpinne-web | Dead man walking ..</title>
<base href="http://home.no.net/fefas/" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
* {
margin: 0;
padding: 0;
vertical-align: top;
text-align: left;
}

html, body {
height: 100%;
}

body {
background-color: #EBEBEB;
background-image: url("images/background.jpg");
}

#top {
width: 550px;
background-image: url("images/izpinne_01.gif");
height: 141px;
}

#main {
min-height: 100%;
height: auto !important;
height: 100%;
width: 550px;
background-image: url("images/main.jpg");
margin-left: 125px;
border-left: 1px solid #325361;
border-right: 1px solid #325361;
}

#navigation {
float:left;
width: 149px;
height: 141px;
margin-left: 10px !important;
margin-left: 5px;
background-image: url("images/izpinne_05.gif");
}

#content {
float:left;
width: 325px;
margin-left: 32px !important;
margin-left: 16px;
background-image: url("images/izpinne_03.gif");
padding: 0 3px 0 3px;
}

body, td, th, div, all {
font-family: Arial, Verdana, Tahoma, "Trebuchet MS";
font-size: 9px;
color: #333;
letter-spacing: 1px;
}
-->
</style>
</head>
<body>
<div id="main">
 <div id="top"></div>
 <div id="content">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc eu mi. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur et felis. Mauris ultricies dui et pede. Nunc nibh tortor, dignissim sit amet, condimentum at, eleifend in, libero. Ut consectetuer sagittis magna. Nulla eu leo condimentum libero mollis viverra. Fusce orci enim, auctor aliquet, condimentum eget, ornare ac, velit. Praesent imperdiet dolor in quam. Mauris rutrum, lacus nec pellentesque euismod, nibh lectus eleifend nibh, non tristique leo purus vel ante. Fusce sagittis. Quisque ac wisi. Mauris facilisis, turpis sit amet euismod elementum, sapien est luctus magna, sit amet facilisis elit mi vitae nibh. Sed at ligula eget ipsum commodo convallis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

Vivamus orci arcu, congue id, faucibus eget, rhoncus id, quam. Pellentesque ante. Quisque sollicitudin nulla. Praesent a augue sit amet ligula malesuada imperdiet. Quisque et eros id arcu lobortis luctus. Ut ut augue. Vivamus rutrum posuere est. In et pede in risus sagittis rhoncus. Aliquam lacus quam, dapibus a, consequat nec, ornare et, lacus. Integer aliquet mi eget turpis. Praesent sit amet velit. Nunc purus. In dui nibh, feugiat id, accumsan et, volutpat vel, nibh. Nullam nulla enim, ultricies vitae, ultricies vitae, viverra et, magna. Suspendisse potenti.

Nulla facilisi. Phasellus eget erat. Quisque consequat. Aenean volutpat, ligula vel ullamcorper semper, leo tellus vulputate est, congue lacinia mi enim eleifend diam. Donec auctor. Etiam mattis vehicula leo. Pellentesque rutrum. Ut ut metus non justo iaculis condimentum. Vivamus ut augue. Nunc euismod, pede ac scelerisque auctor, metus erat aliquet ligula, in tincidunt lacus erat quis massa. Quisque nibh sem, cursus vel, ullamcorper vitae, aliquet quis, diam. Vestibulum at tortor. Ut pellentesque nibh at est tincidunt fermentum. Nam commodo.

Donec imperdiet pulvinar dolor. Etiam wisi. Maecenas dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent mollis tristique eros. Nunc libero est, placerat in, aliquet quis, aliquam ut, felis. Integer quis sapien in odio egestas volutpat. Maecenas quis nibh quis leo euismod rutrum. Nunc vitae elit. Sed congue metus sed metus. Sed nunc wisi, sagittis ac, hendrerit lacinia, vestibulum vel, mi. Duis pharetra varius urna. Pellentesque pulvinar nibh eu justo. Phasellus faucibus, nibh sit amet cursus vulputate, justo neque ultrices lorem, eu sagittis mauris diam non sapien. Phasellus aliquet, odio sodales facilisis pretium, nibh orci commodo neque, ac fringilla mauris purus id mauris. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas erat.

Nullam risus ipsum, pellentesque at, convallis non, interdum non, ipsum. Proin vitae risus. Nam placerat auctor arcu. Pellentesque pharetra, sem nec varius volutpat, quam dui congue augue, a sagittis felis nibh ut mi. Suspendisse potenti. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut venenatis urna sed leo. Nunc euismod erat ac purus. Mauris elit lectus, condimentum sollicitudin, mattis egestas, fermentum sed, arcu. Duis nec velit. Donec placerat imperdiet enim. Nullam fringilla, massa a mollis pulvinar, tortor enim cursus neque, non varius lacus ipsum sit.
 </div>
 <div id="navigation">Meny og sånn her sikkert?</div>
 <div style="clear:both;"> </div>
 </div>

</body>
</html>

Jeg har her byttet ut din absolutt posisjonering med floats. Jeg har også fjernet et par diver som ikke så ut til å være nødvendig. Dersom det er noe av koden du lurer på hvorfor jeg har der, er det bare til å spørr :)

 

Edit: Visste ikke at jeg kunne bruke
Endret av mohuhau
Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste
×
×
  • Opprett ny...