Hallo allemaal,

ik heb een website gemaakt opgebouwd uit div's.

visit: http://www.bernardveeningen.nl/Def1/Index.html

Zoals je ziet is aan de linker kant de div News niet even lang als content. Ik heb echt geen idee hoe ik deze even lang krijg als mijn content met css. WEet iemand dit?

Mijn Css code:

<?php
@charset "utf-8";
/* Lavidas CSS */

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

body {
margin: 0px;
background-color: #ffffff;
font-family: Arial, Helvetica, sans-serif;
background-image: url(../images/OptionBar.gif);
background-repeat: repeat-x;
}


h1 {
font-weight: bold;
font-size: 12px;
}

p {
font-weight: normal;
font-size: 10px;
}

#Container {
position: relative;
width: 760px;
margin: 0px auto;
}

#OptionBar {
background-color: #403f3f;
width:750px;
height:18px;
padding: 5px;

}

#Header {
float: right;
width: 567px;
background-image: url(../images/Header5.gif);
height: 259px;
border-top: 1px solid #ffffff;
border-left: 1px solid #ffffff;
border-bottom: 1px solid #ffffff;

}

#SubContent {
float: right;
background-color: #cdcdcd;
width: 557px;
padding: 5px;
text-align: right;

}

#Content {
background-color: #ececec;
float: right;
width: 558px;
padding: 5px;
}

#Menu {
float: left;
/*background-color: #2f5b6a;*/
background-color: #586f78;
width: 181px;
padding: 5px;
padding-top: 20px;
padding-bottom: 20px;
Text-indent: 20px;
letter-spacing: -1px;
border-top: 1px solid #ffffff;
border-left: 1px solid #ffffff;
border-bottom: 1px solid #ffffff;

}

#News {
postition: relative;
width: 181px;
background-color: #425f6b;
padding: 5px;
float: left;
border-left: 1px solid #ffffff;
}



#Footer {
background-color: #403f3f;
width: 558px;
height: 40px;
clear: both;
padding: 5px;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #ffffff;
float: right;
}

#valid {
float: left;
width: 181px;
padding: 5px;
}

.Left {
width: 265px;
background-color: #ffffff;
padding: 5px;
float: left;

}

.Right {
width: 265px;
background-color: #f3f3f3;
padding: 5px;
float: right;
}

/* Opmaak Tekst */

.NewsTitle {
Font-weight: bold;
font-size: 10px;
color: #fff;
}

.NewsContent {
font-size: 10px;
font-weight: normal;
color: #ffffff;
}

.NewsItem {
background-color: #6c8a96;
}

.NewsItem1 {
}

.ReadMore {
text-align: right;
font-size: 10px;
font-weight: bold;
}

.ReadMore a:link {
color: #000;
text-decoration: none;
}

.ReadMore a:visited {
color: #000;
text-decoration: none;
}

.ReadMore a:active {
color: #000;
text-decoration: none;
}

.ReadMore a:hover {
color: #fff;
text-decoration: none;

}

.Lavidas {
float: left;
padding-top: 4px;
Color: #cccccc;
font-weight: bold;
font-size: 11px;
}

.TopMenu {
float: right;
text-indent: 10px;
}

.TopMenu a:link {
color: #CCCCCC;
font-weight: bold;
font-size: 11px;
text-decoration: none;
}

.TopMenu a:active {
color: #CCCCCC;
font-weight: bold;
font-size: 11px;
text-decoration: none;
}

.TopMenu a:visited {
color: #CCCCCC;
font-weight: bold;
font-size: 11px;
text-decoration: none;
}

.TopMenu a:hover {
color: #ffffff;
background-repeat: no-repeat;
background-position: left;
}

ul#Nav { margin: 0; padding: 0; list-style-type: none; }

ul#Nav li { margin: 0; padding: 0; }


ul#Nav a {
display: block;
color: #fff;
font-weight: bold;
width: 171px;
padding: 0.3em 0.2em 0.3em 0.3em;
text-decoration: none;
}

ul#Nav a:visited {
color: #EEE;
text-decoration: none;
}

ul#Nav
a:hover {
background-color: #5e7882;
color: #ffffff;
}

img {
border: 0px;
}

.content {
padding-top: 10px;
}
?>
Dan heb je dit artikel wel nodig.

Reageren