CSS - Hjälp!
Hejsan!
Idag undrar jag som vanligt en noobig fråga...
På något sätt är inte sidebaren tillhörande till cotatiern och kommer alltid ut, hur fixar jag så att jag har sidebaren till höger inuti contatiern?
Bilden förklarar mycket bättre...
HTML
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="http://fonts.googleapis.com/css?family=Oswald" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="style.css" type="text/css">
<title>X</title>
</head>
<body>
<div id="container">
<div id="header">
<h1>X</h1>
<ul id="menu" class="clearfix">
<li><a href="#">Meny1</a></li>
<li><a href="#">Meny2</a></li>
<li><a href="#">Meny3</a></li>
<li><a href="#">Meny4</a></li>
</ul>
</div>
<div id="page">
<div id="post1">
<h2>X</h2>
<p>Text <a href="#">X</a> 2012-04-10</p>
</div>
</div>
<div id="sidebar">
<ul>
<li>
<h2>X</h2>
<ul>
<li><a href="#">February 2007</a></li>
<li><a href="#">January 2007</a></li>
<li><a href="#">December 2006</a></li>
<li><a href="#">November 2006</a></li>
<li><a href="#">October 2006</a></li>
</ul>
</li>
</ul>
</div>
<div id="footer">
<p>X</p>
</div>
</div>
</body>
</html>
CSS
body {
margin-top: 50px;
padding: 0;
padding-left: 100px;
background: #696466;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
}
#header h1 {
padding-top: 45px;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
font-weight: normal;
color: #4D4040;
text-align: center;
font-size: 2.4em;
}
#header,#page {
margin-bottom: 2em;
width: 66%;
min-width: 600px;
background-color: #FFF;
border-radius: 8px;
margin-right: 355px;
margin-left: auto;
}
#menu {
width: 48%;
width: -moz-max-content;
width: intrinsic;
margin: auto;
padding: 10px;
}
#menu li {
list-style: none;
float: left;
padding: 0;
}
#menu li a:link, #menu li a:visited{
text-decoration: none;
padding: 10px;
display: block;
}
#menu li a:hover {
text-decoration: none;
background-color: #362B2F;
color: #FFF;
}
#menu a {
line-height: 30px;
letter-spacing: 1px;
text-decoration: none;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
font-size: 14px;
font-weight: normal;
color: #262626;
border: none;
}
#sidebar {
}
#post1 h2 {
margin: 0;
padding: 0;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
font-size: 1.9em;
color: #262626;
}
#post1 {
width: 600px;
padding: 45px;
}
a {
text-decoration: none;
color: #2483A6;
}
#footer {
margin: 0;
padding-top: 16px;
line-height: normal;
text-align: center;
color: #576475;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
