Unwanted margin on div with CSS - html

Question

I'm trying to format a website with Dreamweaver and CSS, but I'm getting unwanted margins on the "left" div that runs the length its container:
<div class="cover">
<div class="Header">
<div class="header_left"><input name="searchbar" type="text" class="header_searchbar" value="Search" maxlength="50">
<img src="image/search.jpg" width="122" height="344" align="baseline" class="header_search_icon"></div>
<div class="header_center"> <img src="image/logo.jpg" width="194" height="81" hspace="53" class="logo"></div>
<div class="header_right">
<div class="header_right_login">Sign In</div>
<img src="image/lock.jpg" width="11" height="16">
<div class="header_right_language">
<p>Languages</p>
</div>
</div>
</div>
<div class="Content">
<div id="hot_bar">
<div id="left"> <img src="image/left.jpg" alt="" width="33" height="65"></div>
<div id="center"> content placeholder</div>
</div>
</div>
<div class="footer">
<ul>
<li>About </li>
<li2>/</li2>
<li>Family</li>
<li2>/</li2>
<li>Privacy Policy</li>
<li2>/</li2>
<li>Terms of Service</li>
<li2>/</li2>
<li>Help</li>
<li2>/</li2>
<li>Contact Us</li>
</ul>
</div>
</div>
CSS:
#left {
height: 298px;
width: 54px;
margin: 0px;
padding: 0px;
clear: left;
}
.cover .Content #hot_bar #left img {
margin-top: 125.5px;
}
#center {
height: 298px;
width: 724px;
margin-left: 0px;
float: none;
}
#right {
margin: 0px;
padding: 0px;
clear: right;
height: 298px;
width: 98px;
}
.right {
margin: 0px;
padding: 0px;
clear: right;
height: 298px;
width: 98px;
}
div {
width: 150px;
}
body {
margin: 0px;
padding: 0px;
}
Edit: it looks like this in Chrome's inspect elements:
The Chinese part is the content placeholder. The content part looks like this:
Excuse me for the poor formatting. I'm quite new at this.

Answer 1

You should change css order.
body ,div,......,left,... and add !important. inside #left
/* !important is an optional . */
#left {
height: 298px;
width: 54px;
margin-left: 0px !important;
padding-left: 0px !important;
left:0 !important;
top:0 !important;
clear: left;
}
.content,#hot_bar{
margin-left: 0px ;
padding: 0px 0px;
clear: left;
left:0 !important;
}
fiddle