<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Markup Example</title>
<meta name="description" content="Site Description">
<link rel="stylesheet" href="main.css">
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="logo"></div>
<ul id="menu">
<li class="item"><a href='#'>Home</a></li>
<li class="item"><a href='#'>Shop</a></li>
<li class="item brand">
<a href="#">
<img src="img/logo-small.png" style="border:0" />
</a>
</li>
</ul>
</div>
<div id="container">
<div class="advirtisement"><!-- blank.fw.png --></div>
<div id="news">
<?php echo $siteName(); ?>
<ul class="news_container">
Float Right width 65%; ?
<?php
echo $site->getNews();
?>
</ul>
</div>
<aside class="sidebar">
Float To Right 25%; ?
</aside>
</div>
<footer class="footer">
<p>Copyright © 2013 SiteName;</p>
</footer>
</div>
</body>
</html>
.holder { (holds the div's together);
width: 220px;
margin: auto; (if you want it to be center both of it)
#left_box {
background: #000 (color);
width: 100px;
height: 100px;
margin-right: 10px; (if you want space between the rightbox)
float: left;
}
#right_box {
background: #000 (color);
width: 100px;
height: 100px;
float: right;
}<html>
<body>
<div class="holder">
<div id="left_box"></div>
<div id="right_box"></div>
</div>
</body>
</html>
