CodePen

HTML

            
              <div id="header">
  
  <div class="col1">
    <div id="logo">
      Sample Logo
      <p>www.sample.com</p>
    </div>
  </div>
  
  <div class="col2">
  </div>
  
  <div class="col3">
     <div class="col3ia">
       <div class="image"></div>
       <ul class="cartinfo">
      <li><a href="#" class="total">0 items $0.00</a></li>
      <li><a href="#" class="cart">View Cart</a></li>
       </ul>
     </div>
  </div>
						
</div>

            
          
!

CSS

            
              #header {
	background: #ccc;
  width: 980px;
  margin: 0px auto;
}
.col1 {
	float: left;
}

#logo {
	color: green;
  margin-top: 30px;
  font-size: 60px;
  font-style: italic;
  font-weight: bolder;
}
#logo p {
  font-size: 29px;
  margin-left: 75px;
  font-weight: normal;
  margin-top: 0px;
}
.col2 {
	float: left;
  margin-left: 65px;
  margin-top: 60px;
}

.col3 {
  float: right;
  margin: 0px;
  padding: 0px;
}
.col3ia li {
  list-style: none;
  margin-right: 40px;
  text-decoration: none;
}
.col3ia li a{
  text-decoration: none;
}
.image {
  float: left;
  width: 100px;
  height: 100px;
  background: url(http://s22.postimg.org/rq0eax03x/diagram_v2_29.png);
}
.total {
  float: left;
  font-size: 40px;
  font-weight: bolder;
  color: #000000;
  
}
.cart {
  float: left;
  color: gold; 
  font-size: 20px;
}

ul.cartinfo {
  float:left;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................