Menu
Hey guys,
I’m building a website right now, and I wanted to make two columns within my content div. I made two floating div’s so they were next to eachother. Now when I place more information in my floating divs, the content div won’t grow with the inner div’s. I’ve been looking for a solution for this problem, but I could only find things to make a scrollbar, and one thing I hate is scrollbars that aren’t the browser’s scrollbar. ?
Here’s some code:
[code=html]
<body>
<div id=”container”>
<div id=”header”></div>
<div id=”menu”>
<?php include(“include/menu.php”); ?>
</div>
<div id=”contentainer”>
<div id=”content”>
<div id=”blogcontent”>
<div class=”item”>
<div class=”title”>Blog-item 1</div>
<div class=”content”>
Er komt hier dus al best wel wat tekst te staan die ik maar even uit me hoofd hier neer moet lullen.
Dat gaat me opzich nog best makkelijk af lalalalalalalalalaa ik ben gek.
</div>
<div class=”readmore”><a href=”article.php?id=1″>Lees meer</a></div>
<div class=”date”>12-07-1988</div>
</div>
<div class=”item”>
<div class=”title”>Blog-item 1</div>
<div class=”content”>
Er komt hier dus al best wel wat tekst te staan die ik maar even uit me hoofd hier neer moet lullen.
Dat gaat me opzich nog best makkelijk af lalalalalalalalalaa ik ben gek.
</div>
<div class=”readmore”><a href=”article.php?id=1″>Lees meer</a></div>
<div class=”date”>12-07-1988</div>
</div>
<div class=”item”>
<div class=”title”>Blog-item 1</div>
<div class=”content”>
Er komt hier dus al best wel wat tekst te staan die ik maar even uit me hoofd hier neer moet lullen.
Dat gaat me opzich nog best makkelijk af lalalalalalalalalaa ik ben gek.
</div>
<div class=”readmore”><a href=”article.php?id=1″>Lees meer</a></div>
<div class=”date”>12-07-1988</div>
</div>
</div>
<div id=”fotocontent””>
<div class=”item”>
<div class=”title”>Foto’s</div>
</div>
</div>
</div>
</div>
</div>
</body>
And my css:
[CODE]
@charset “utf-8”;
/* CSS Document */
body {
margin-top: 0px;
}
#container {
width: 1024px;
margin-left: auto;
margin-right: auto;
}
#header {
background: url(images/newheader.jpeg);
height: 138px;
width: 1024px;
}
#menu {
height: 25px;
background: #38a31e;
}
#links {
padding: 0;
margin: 0;
text-align: center;
list-style: none;
}
#links li {
background: #38a31e;
float: left;
width: 120px;
height: 25px;
}
#links li:hover {
background: #adc02e;
}
#links a {
display: block;
height: 25px;
text-decoration: none;
color: #adc02e;
font-size: 1.2em;
font-family: “Cooper Black”, “Lucida Sans”, sans-serif;
}
#links a:hover {
color: #38a31e;
}
#content {
background: #adc02e;
height: 400px;
overflow: auto;
}
#links .selected {
background: #adc02e;
color: #38a31e;
}
#blogcontent {
width: 48%;
min-height: 300px;
margin-left: 7px;
margin-top: 7px;
border: 5px red dashed;
float: left;
}
#fotocontent {
width: 48%;
min-height: 300px;
margin-right: 7px;
margin-top: 7px;
border: 5px red dashed;
float: right;
}
.item {
margin: 9px;
padding: 5px;
border: 1px black solid;
min-height: 100px;
width: 94%
}
.title {
font-size: 20px;
font-weight: bold;
}
The html seems a bit messy, but that’s because I use the php include a few times.
The css is probably ****ty too, but that’s because I’m bad at it. ?
Thanks for your help,
mrpaplu