beste,
ik heb website gemaakt. dit is de zogenaamde template:
als css heb ik dit:
nu heb je twee artikels en die staan op auto, dus hoe groter hoe groter dat vak is. dit werkt.
ook de aside is auto in hoogte.
maar wat ik wil is dat de aside de hoogte aanneemt van beide articels...
weet iemand hoe dat moet?
mvg martii
ik heb website gemaakt. dit is de zogenaamde template:
HTML:
<!doctype html>
<html lang="nl">
<head>
<meta charset="utf-8" />
<title> Welcome! </title>
<link rel="stylesheet" href="./main3.css">
</head>
<body>
<div id="big_wrapper">
<header id="top_header">
<h1>Hi, this is my site ;) </h1>
</header>
<nav id="top_menu">
<ul>
<li>Home</li>
<li><a href="./contact.html">Contact</a></li>
<li><a href="./about.html">About</a></li>
</ul>
</nav>
<section id="main_section" >
<article>
<header>
<hgroup>
<h1> Article about good morning raaskdfjlskaf <br>asdfasdf</br>asdfasfdasdfasdf</h1>
<h2> Good morning article </h2>
</hgroup>
</header>
<p>Good morning! this is my article</p>
<footer>
<p>-written by martii</p>
</footer>
</article>
<article>
<header>
<hgroup>
<h1>Article about good evening</h1>
<h2> Good evening (copy article) </h2>
</hgroup>
</header>
<p>Good evening! this is my copy article</p>
<footer>
<p>Written on 22-9-2014</p>
</footer>
</article>
</section>
<aside id="side_news">
<h4>News</h4>
This site is very basic! Without any design
</aside>
<footer id="the_footer">
<p id="test1"> Copyright 321test</p>
</footer>
</div>
</body>
</html>
als css heb ik dit:
Code:
*{
margin: 0px;
padding: 0px;
}
h1{
font: bold Tahoma 20px;
}
h2{
font: bold Tahoma 14px;
}
header, section, footer,aside,nav,article,hgroup{
display:block;
}
body {
text-align:center;
}
#big_wrapper{
border:1px solid red;
width:1000px;
margin: 20px auto;
text-align:left;
}
#top_header {
background:FFFBCC;
border: 1px solid red;
padding:20px
}
#top_menu {
background:FFFBCC;
border: 1px solid red;
color:black;
}
a {
text-decoration:none;
color:black;
}
#top_menu li {
display:inline-block;
list-style:none;
padding:7.5px;
font:bold 14px Tahoma
}
#main_section {
float: left;
width:658px;
margin:30px; /* 720px 280 left*/
}
#side_news {
float:left;
width:190px;
height: auto;
margin: 30px 0px;
padding:30px;
background:#FFFBCC;
border: 1px solid red;
}
#the_footer {
clear:both;
text-align:center;
padding:5px;
border-top:2px solid red;
}
article {
background: #FFFBCC;
border:1px solid red;
padding:20px;
margin-bottom:15px;
}
article footer {
text-align: right;
}
nu heb je twee artikels en die staan op auto, dus hoe groter hoe groter dat vak is. dit werkt.
ook de aside is auto in hoogte.
maar wat ik wil is dat de aside de hoogte aanneemt van beide articels...
weet iemand hoe dat moet?
mvg martii