The positioning of my sidebar is currently below the content on the left side of the page, but I want it to sit beside the content on the right side. I've tried various solutions from similar questions without success. Here is an example of how I would like the layout to appear: View sample format.
CSS:
#header {
background-color:#ffffff;
color:white;
text-align:center;
padding:5px;
}
#navbar {
background-color:#ffffff;
color:#000000
text-align:left;
padding:5px;
}
#section {
background-color:#ffffff;
width:500px;
float:left;
padding:10px;
}
#sidebar {
line-height:30px;
background-color:#14004d;
height:300px;
width:200px;
float:right;
padding:5px;
}
#footer {
background-color:#14004d;
color:#ffffff;
clear:both;
text-align:center;
padding:5px;
}
HTML:
<body bgcolor="#ffffff">
<div id="header">
<h1><center>header image here</center></h1>
<div id="navbar">
<p style="color:#14004d">
Home    Services    Portfolio    Testimonials
</p>
</div>
<div id="section">
text text text text text text text text text text text text text text text
</div>
<div id="sidebar">
<p style="color:#ffffff">
contact info will be listed here.</p>
</div>
<div id="footer">
Copyright © Cassidy v. Ros Online Marketing Solutions
</div>
</body>