Witam, mam zamiar zrobić stronę, lecz problemem okazał się div sidebar. Chciałbym aby był "przyczepiony" do lewej strony. a obok niego znajdował się div content. Jednak sidebar jest pod topbarem, a content pod sidebarem. Zamieszczam zdjęcie stron, dla lepszego zobrazowania problemu. http://scr.hu/63ov/vklpy
KOD HTML
<!DOCTYPE HTML>
<html lang="pl">
<head>
<meta charset="utf-8" />
<title> Gry </title>
<meta name="description" content="Cyfrowy świat!"/>
<meta name="keywords" content="Najlepsze gry" />
<meta http-equiv="X-UA-compatible" content="IE=edge,chrome=1"/>
<link rel="stylesheet" href="styledogry.css" type="text/css" />
<link href='https://fonts.googleapis.com/css?family=Ubuntu:400italic,700italic&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
</head>
<body>
<div id="container">
<div id="logo">
<h1>Najlepsza strona z grami </h1>
</div>
<div id="menu">
XXXX. YYYY, ZZZZZ
</div>
<div id="topbar">
<div id="topbarL">
<img src="img/logo3.png">
</div>
<div id="topbarR">
<div style="clear:both;"></div>
<br></br>
Niektórzy trzymają się prawa inni nie, każdy człowiek sam decyduje jak urządzi swoje życie, no i potrzeba trochę szczęścia, żeby ktoś inny nie popsuł Ci tego co zbudowałeś. To nie takie proste jak uczą w podstawówkach.
</div>
<div id="sidebar">
XXXXX <br></br>
YYYYY <br></br>
ZZZZZ <br></br>
</div>
<div id="content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque non leo eget arcu tempus porttitor. Integer ac fermentum elit. Cras mollis risus ac lectus auctor, in feugiat sapien mattis. Morbi nec augue at urna auctor tempus. Sed nunc nisl, porta condimentum urna ut, venenatis eleifend nulla. Donec interdum eleifend eleifend. Nunc quis molestie nibh.
<br></br>
Pellentesque fringilla luctus turpis et tincidunt. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nulla eget molestie magna. Aliquam posuere interdum eros quis mattis. Donec varius nunc id sapien eleifend mollis. Cras ex augue, consequat vitae ultrices id, pulvinar nec felis. Maecenas vehicula vel lectus ut malesuada. Interdum et malesuada fames ac ante ipsum primis in faucibus. Mauris placerat auctor neque. Phasellus vel vulputate velit. Praesent pellentesque sapien sed erat aliquet, ac mattis ex consectetur. Pellentesque sit amet pharetra tortor, ut scelerisque mauris. Duis viverra molestie enim id mattis. Duis at nibh eget risus lacinia malesuada in at lorem. Mauris condimentum tincidunt enim.
<br></br>
Vestibulum tincidunt risus at nibh ornare suscipit. Suspendisse condimentum imperdiet metus nec bibendum. Vivamus eget ante et orci aliquet condimentum et vel nisi. Donec a rutrum augue. Nullam dignissim turpis nibh, in lobortis nulla tristique vel. Cras porttitor mauris at vulputate viverra. Proin convallis vehicula gravida. Nunc ligula ex, dignissim non blandit sed, maximus et elit. Cras pulvinar aliquet est ac ornare. Nunc id justo non est pretium porta id sed risus. Maecenas et ip
</div>
<div id="footer">
Wszelkie prawa zastrzeżone
</div>
</div>
</body>
</html>
KOD CSS
body
{
background-color:#404040;
font-family:'Ubuntu', sans-serif;
}
#container
{
width:1000px;
margin-left:auto;
margin-right:auto;
}
#logo
{
letter-spacing:3px;
color:white;
font-weight:900px;
font-size:34px;
}
#menu
{
background-color:grey;
height:35px;
font-size:18px;
padding:15px;
margin-top:40px;
margin-bottom:20px;
}
#topbar
{
background-color:#128870;
height:160px;
}
#topbarL
{
width:200px;
float:left;
border-right:dotted 3px #cccccc
}
#topbarR
{
width:500px;
float:left;
font-size:18px;
}
#sidebar
{
width:150px;
background-color:lightgray;
height:600px;
float:left;
padding:10px;
}
#content
{
float:left;
width:730px;
text-align:justify;
font-size:17px;
background-color:#dedede;
}
#footer
{
clear:both;
font-size:20px;
color: white;
text-align:center;
}
