由于Ektron CMS中的锁定模板，我被迫在页面css上使用，但我正在尝试解决我的h3.subhead未对齐所有三列顶部的问题。在Chrome中，col1和col3具有额外的不需要的空间。在IE中，所有三列都有额外的空间。不知道如何解决。
* {
padding: 0;
margin: 0;
}
* a {
text-decoration: underline;
}
* a:hover {
text-decoration: none;
}
#sidebar {
width: 20%;
float: right;
padding: 15px 30px 5px 5px;
}
#left {
padding-left: 25px;
float: left;
width: 70%;
}
.clear {
clear: both;
}
#sidebar h2 {
display: block;
padding: 5px;
border-bottom: solid 1px #808184;
text-transform: uppercase;
color: #158C59;
}
#sidebar ul {
list-style: none;
/*margin-bottom:15px;*/
}
#sidebar li {
display: block;
border-bottom: solid 1px #f2eddc;
line-height: 200%;
}
h3.subhead {
font-size: 12px;
text-transform: uppercase;
color: #fff;
display: block;
padding: 5px 0 5px 5px;
background: #158c59;
}
/*.columns {padding:0 8px 0 8px;}*/
.col1 {
width: 30%;
float: left;
}
.col3 {
width: 30%;
float: right;
}
.col2 {
margin: 0 32% 0 32%;
}
.clear2 {
width: 590px;
clear: left;
float: right;
color: #fff!important;
}
.columns div {
background: #f2eddc;
height: 240px;
}
.columns div p {
padding: 5px;
}
.columns h3 {
align: top;
top: 0px;
}
#subnav {
padding: 9px 50px 0 420px;
color: #fff;
}
#subnav a {
color: #fff;
text-decoration: none;
}
img.leftalign,
img.rightalign {
display: block;
padding: 3px;
background: #efefef;
border: solid 1px #ddd;
}
img.leftalign {
float: left;
margin-right: 8px;
}
img.rightalign {
float: right;
margin-left: 8px;
}
h1#sitename {
display: block;
padding: 5px 70px 0 50px;
color: #fff;
}
#sitename a,
#sitename a:visited,
#sitename a:hover {
color: #fff;
text-decoration: none;
}
#left h2 {
color: #158c59!important;
}
blockquote {
background: #efefef;
padding: 5px;
border: solid 1px #ddd;
display: block;
margin: 5px;
}
blockquote.leftalign {
width: 300px;
float: left;
}
.post ul,
.post ol {
margin-bottom: 15px;
}
.post li {
padding: 3px;
}<div id="wrap">
<div id="content">
<div id="left">
<div class="columns">
<div class="col1">
<h3 class="subhead">Strategic Reinvention Plan</h3>
<p>WHEDA is always working to stay current and look towards how we can best succeed in the future.
<a href="uploadedFiles/Website/Feb 2016 Board SRPI presentation 2.pptx" title="WHEDA Strategic Reinvention Plan" target="_blank">Click here</a> to view the presentation by our leadership, presented at the last all staff meeting.</p>
</div>
<div class="col3">
<h3 class="subhead">New Employees</h3>
<p>Welcome to
<a href="http://whedanet.wheda.com/Default.aspx?id=2318" title="Ging Skievaski">Ging Skievaski</a> on our Risk & Compliance team and
<a href="http://whedanet.wheda.com/Default.aspx?id=2320" title="Michael Clark">Michael Clark</a> on our Information Technology team!
<br/>
<br/>
<br/>
</p>
</div>
<div class="col2">
<h3 class="subhead">2016 Board Meeting Schedule</h3>
<p>Remember, you can't wear jeans on days that the WHEDA board is meeting. The 2016 meeting schedule is:</p>
<p><strike>February 17</strike>
<br/>April 20
<br/>June 15
<br/>August 17
<br/>October 19
<br/>December 21 </p>
</div>
</div>
<div class="clear2"></div>
<br/>
<div class="post">
<h2>WHEDA Logo Files</h2>
<p>Logo for Use in Partner Publications - <b>All logo use must follow our <a href="https://www.wheda.com/WorkArea/DownloadAsset.aspx?id=293" title="Brand Standards">Brand Standards</a> </b>
<br/>(Right click and select Save As)</p>
<table dropzone="copy" style="text-align: center; width: 100%; border-spacing: 0px; border-collapse: collapse;">
<tbody>
<tr>
<td style="cursor: default;">
<img src="https://www.wheda.com/assets/0/81/90/179/646ddd39-3e15-4bb2-8efb-5c90f4eceb24.jpg" alt="Main Logo JPG" title="Main Logo JPG" class="fancy" width="300px" draggable="true" /> </td>
</tr>
</tbody>
</table>
</div>
</div>
<div id="sidebar">
<h2>Quick Links</h2>
<ul>
<li>
<a href="http://apps.whedanet.wheda.com/suggestionbox">Employee Suggestion Box</a>
</li>
<li><i><a href="http://whedanet.wheda.com/uploadedFiles/WHEDANET/Administration/Human_Resources/Suggestion%20Box%208-27-15.pdf">Suggestion Box Tracker</a></i>
</li>
<li>
<a href="mailto:wheda.helpdesk@wheda.com">Submit a Help Desk Ticket</a>
</li>
<li>
<a href="http://whedanet.wheda.com/uploadedFiles/WHEDANET/Marketing/MARKETINGJobTicket2014fill.pdf">Submit a Marketing Ticket</a>
</li>
<li>
<a href="http://whedanet.wheda.com/Default.aspx?id=1941">Applications</a>
</li>
</ul>
<h2>Resources</h2>
<ul>
<li>
<a href="https://portal.adp.com/">ADP</a>
</li>
<li>
<a href="http://whedanet.wheda.com/WorkArea/linkit.aspx?LinkIdentifier=id&ItemID=1635&libID=1656">DocFinity Information</a>
</li>
<li>
<a href="https://login.salesforce.com/">Salesforce Login</a>
</li>
<li>
<a href="http://wi.gov/state/">Wisconsin eGov Portal</a>
</li>
<li>
<a href="http://wi.gov/state/core/sowdir/directory_online.asp">State of Wisconsin Phone/Email Directory</a>
</li>
<li>
<a href="http://ces.landsend.com/WHEDAgear">WHEDAGear Online Store</a>
</li>
<li>
<a href="http://whedanet.wheda.com/WorkArea/linkit.aspx?LinkIdentifier=id&ItemID=387&libID=408">Loan Committee Schedule</a>
</li>
<li>
<a href="http://whedanet.wheda.com/uploadedFiles/WHEDANET/Finance/Travel%20and%20Expense%20Reimbursement%20Form(1).xlsm">Travel Expense Reimbursement</a>
</li>
<li>
<a href="http://whedanet.wheda.com/uploadedFiles/WHEDANET/Finance/travelpolicy.pdf">Travel Policy</a>
</li>
<li>
<a href="http://whedanet.wheda.com/uploadedFiles/Website/Loan%20Policy%20043015%20FINAL%20Board%20Approved.pdf">Loan Policy</a>
</li>
<li>
<a href="http://whedanet.wheda.com/uploadedFiles/WHEDANET/Marketing/Social%20Media%20and%20Communications%20Policy.pdf">Communications & Social Media Policy</a>
</li>
<li>
<a href="http://whedanet.wheda.com/uploadedFiles/WHEDANET/Finance/EthicsHotline.pdf">Whistleblower/Ethics Hotline - FAQs</a>
</li>
</ul>
</div>
<div class="clear"></div>
</div>
</div>
答案 0 :(得分：0)
你可以尝试给它们所有的margin-top：0px和padding-top：0px只是在其他地方添加边距或填充。
如果没有，你也可以尝试弹出那些重要的标签。
如果您通过右键单击然后选择＆＃34;检查元素＆＃34;来检查元素。你或许可以找到问题的根源。
也可能是他们只需要向左或向右浮动！