Wrapper DIV med bakgrunn strekkes ikke helt ned

Snill som jeg er så lagde jeg et design som ligner veldig på ditt. Vet ikke om det er dette du ønsker men gjorde det likevel.

Se designet her (DEMO).

HTML

HTML Code:

<!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>100% DIV's</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="wrapper">
    <div id="box_left">
        <div id="toppen"> </div>
        <div id="midt">
            <ul>
                <li>Velkommen</li>
                <li>Heisann</li>
                <li>Hvordan</li>
                <li>Testing</li>
            </ul>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ut tellus blandit sem feugiat molestie. Sed at commodo metus. In consectetur viverra lectus, ut rutrum sapien posuere sit amet. Phasellus et nisi sit amet risus egestas dignissim ac eget tortor. Donec quam lorem, semper vel lacinia id, mattis sit amet sem. Fusce ullamcorper euismod velit. Etiam ornare arcu sed urna rutrum nec eleifend orci convallis. Vivamus in est quam. Mauris placerat vestibulum ultricies. Curabitur lorem est, rutrum in adipiscing nec, tempus quis felis. Pellentesque scelerisque mattis enim, et porttitor purus tristique ut. Donec id ante eros.</p> 
        </div>
        <div id="bunn"> </div>
    </div>
    <div id="box_right"> 
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ut tellus blandit sem feugiat molestie. Sed at commodo metus. In 				consectetur viverra lectus, ut rutrum sapien posuere sit amet. Phasellus et nisi sit amet risus egestas dignissim ac eget tortor. Donec quam lorem, semper vel lacinia id, mattis sit amet sem. Fusce ullamcorper euismod velit. Etiam ornare arcu sed urna rutrum nec eleifend orci convallis. Vivamus in est quam. Mauris placerat vestibulum ultricies. Curabitur lorem est, rutrum in adipiscing nec, tempus quis felis. Pellentesque scelerisque mattis enim, et porttitor purus tristique ut. Donec id ante eros.</p> 
    </div>
</div> <!-- End Wrapper -->
</body>
</html>

CSS

Code:

@charset "utf-8";

/* Presets and Options */

* {
	padding: 0px;
	margin: 0px;
}

html, body {
	font-family: Tahoma, Geneva, sans-serif;
	background-color: #343f45;
    height: 100%;
}

/* Edit Preset classes */

li {
	font-size: 10px;
}

p {
	font-size: 11px;
}

/* Wrapper */

#wrapper {
	width: 873px;
	margin-left: auto;
	margin-right: auto;
	height: 100%;
}

/* Start BOX (box left)*/

#wrapper #box_left {
	width: 536px;
	float: left;

}

#wrapper #box_left #toppen {
	background-image: url(img/box_top.jpg);
	background-repeat: no-repeat;
	height: 21px;
}

#wrapper #box_left #midt {
	background-image: url(img/box_midt.jpg);
	background-repeat: repeat-y;
	padding-left: 35px;
	padding-right: 35px;
	width: 466px;
}

#wrapper #box_left #bunn {
	background-image: url(img/box_bottom.jpg);
	background-repeat: no-repeat;
	height: 21px;
}

/* Start BOX (box right)*/

#wrapper #box_right {
	float: right;
	width: 255px;
	background-color: white;
	min-height: 100%;
	padding-left: 5px;
	padding-right: 5px;
}

Happy Coding! Så vet du hvertfall hvordan jeg gjør det. Om dette funker like bra i IE 6 er jeg vell noe usikker på men du finner fort en løsning med google etc. Eneste du trenger er å smekke inn en footer med ditt behov og vips! alt følger etter

Tråd: Wrapper DIV med bakgrunn strekkes ikke helt ned

LinkBack

Trådverktøy

Display

Regler for innlegg