nicht angemeldet
Ich stehe vor folgendem Problem:
Ich möchte in einem DIV mit einer Hintergrundfarbe 2 divs nebeneinander positionieren, habe aber das Problem, dass dies nicht so geht, wie ich es gerne hätte. Wie schaffe ich es beispielsweise, dass der news-Bereich rechts genauso lang wird wie der content-bereich links. Ich habe versucht das main-div mit der gleichen Fabrbe zu füllen, aber das hatte keine auswirkung.
Hat jemand einen Tipp?
---------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="holder">
<div id="header">
<div id="wrapper">
<span id="one">head1</span><br>
<span id="two">head2</span>
</div>
<div id="headpic">
bild.jpg
</div>
</div>
<div id="menu">
<a href="index.html">nav1</a>
<a href="index.html">nav2</a>
<a href="index.html">nav3</a>
<a href="index.html">nav4</a>
<a href="index.html">nav5</a>
</div>
<div id="main">
<div id="content">
<p>Diese Seite entsteht und</p>
<p>und entsteht und</p>
<p>entsteht.</p>
<div id="footer">
<p>Copyright © ich</p>
</div>
</div>
<div id="rightpane">
<h5>News</h5>
<p>keine</p>
</div>
</div>
</div>
</body>
</html>
---------------------------------------------------------------------
body {
background: #39322B;
}
/* ___________________________________________________________________ */
#holder {
}
/* ___________________________________________________________________ */
#header {
border-bottom: 5px #fff solid;
background: #eed;
}
#header #wrapper{
float:left;
width:19em; height:auto;
}
#header #one {
font: 3em "Trebuchet MS", Trebuchet, serif;
color: #fff;
}
#header #two {
font: italic 1em georgia, serif;
color: #998;
}
#header #headpic{
margin-left:20em;
text-align:right;
height:5em;
}
/* ___________________________________________________________________ */
#menu {
background: #D3D2B8;
font: bold .8em arial, sans-serif;
}
#menu a{
color: #645846;
text-decoration: none;
}
#menu a:hover{
color: #fff;
}
/* ___________________________________________________________________ */
#main {
}
/* ___________________________________________________________________ */
#content {
float: left;
width:75%;
background: #fff;
}
#content h1 {
font: 1.6em garamond, serif;
color: #77773C;
border-bottom: 1px #77773C dashed;
}
#content p {
width: 94%;
font: .8em arial, sans-serif;
color: #222;
}
#content p.indent{
text-indent: 10px;
}
#content p a{
color: #77773C;
font-weight: bold;
text-decoration: none;
}
#content p a:hover{
color: #aaa;
text-decoration: none;
}
/* ___________________________________________________________________ */
#rightpane {
background: #D3D2B8;
font: .7em arial, sans-serif;
color: #555;
}
#rightpane h5{
font: bold 1.2em verdana, sans-serif;
color: #645846;
}
#rightpane p{
background: #D3D2B8;
}
/* ___________________________________________________________________ */
#footer{
}
#footer p{
font: bold .6em verdana, sans-serif;
color: #bbb;
text-align: right;
}