檢查以前的帖子後仍然無法對齊浮動div？

Question

檢查了以前的帖子，但仍然無法找到問題 - 以前有3個div，全部左移並完全對齊邊界/填充/邊距。

現在我正在嘗試做一個簡單的佈局更改（2 divs/float左 - 並排）但無法獲得第二個div對齊第一個，不知道有什麼問題。檢查錯過的結束標籤等，但沒有看到會導致這種情況。

任何想法將不勝感激！ HTML，CSS，& JS現在是一款非工作型計算器，下面列出了它們，不知道它們是否會正確顯示。

HTML

<h2>What is General Services?</h2> 
<div class="d1gs"> 
    The District 1 Committee of Alcoholics Anonymous is a service body for the groups in   
    District 1. It is comprised of the groups' General Service Representatives (GSR's),  
    District ... 
</div> 
<br> 
<div class="d1gs"> 
    Its primary purpose is to provide a forum for sharing collective 12th Step experience 
    how best to carry the AA message in the Pinellas County area. The District also has 
    responsibility ... 
</div> 
<br> 
<div class="d1gs"> 
    District 1 is supported by the voluntary contributions of the groups it serves. The  
    District One Committee structure borrows much from "The AA Service Manual and Twelve 
    Concepts ... 
</div> 
<br> 

<!-- begin.column2 --> 
<div id="column2"> 
    <div id="center"><strong>Sobriety Calculator</strong></div> 
    <em><small> 
     Every alcoholic who has been graced with the gift of sobriety is a miracle 
     please use the calculator below to find out how long you've enjoyed your new found 
     freedom… 
    </small></em> 
    <div class="center" style="height: 5px;"><small><strong>RIGHT DOWN TO THE SECOND! 
    </strong></small></div> 
    <form id="live" class="center" name="live"> 
     <small>Sober Date: (i.e. <span style="font-style: italic;">May 28, 1995</span>)</small> 
     <input type="text" name="age" size="18" /> 
     <input onclick="sobertimer(this.form)" type="button" name="start" value="Click Here" /> 
     <input type="reset" name="resetb" value="Reset" /> 
     <label><small>Sober Days</small> </label> <br><input type="text" name="time3" size="12" /> 
     <label><small>Sober Hours</small> </label> <br><input type="text" name="time2" size="12" /> 
     <label><small>Sober Minutes</small></label> <br><input type="text" name="time1" size="12" /> 
     <label><small><em><strong>SOBER HEARTBEATS!</strong></em></small></label><br> 
     <input type="text" name="time4" size="12" /> 
    </form> 
</div> 
<!-- end .column2 --> 

CSS

/* What is District 1 General Services? 
-------------------------------------------------------------- */ 
.d1gs { 
    font-family: 'Georgia', 'Times New Roman', Times, serif; 
    font-size: 14px; 
    float: left; 
    width: 55%; 
    margin-bottom: 1.5%; 
    margin-top: .5%; 
    margin-left: .35%; 
    padding: 1% 0 1% 2%; 
} 

/* Sobriety Calculator 
-------------------------------------------------------------- */ 
#column2 { 
    font-family: 'Georgia', 'Times New Roman', Times, serif; 
    font-size: 13px; 
    line-height: .5em; 
    font: 80%/1.4 Verdana, Arial, Helvetica, sans-serif; 
    float: left; 
    width: 30%; 
    margin-bottom: 1.5%; 
    margin-left: .35%; 
    padding: .5%; 
    height: 100%; 
    background-color: rgba(255,255,255,.3); 
    border-style: inset; 
    border-width: 3px; 
    border-color: #B2B200; 
} 

的Javascript

<script type="mce-text/javascript">// <![CDATA[ 
function sobertimer() { 
    today = new Date(); SoberDay = new 
    Date(document.live.age.value); timeold = (today.getTime() - SoberDay.getTime()); 
    sectimeold = timeold/1000; secondsold = Math.floor(sectimeold); msPerDay = 
    24 * 60 * 60 * 1000; timeold = (today.getTime() - SoberDay.getTime()); 
    e_daysold = timeold/msPerDay; daysold = Math.floor(e_daysold); e_hrsold = 
    (e_daysold - daysold) * 24; hrsold = Math.floor(e_hrsold); minsold = 
    Math.floor((e_hrsold - hrsold) * 60); document.live.time4.value = secondsold; 
    document.live.time3.value = daysold; document.live.time2.value = hrsold; 
    document.live.time1.value = minsold; timerID = setTimeout("sobertimer()", 1000); 
} 
// ]]></script> 

Answer 1

如果我現在明白你想要兩列......那麼就把它放在一個<div id="column1>"中，然後把它放在左邊並固定寬度。然後讓你的column2漂浮在右邊，並使用靜止寬度。

*注意填充，邊距和邊框的寬度。

看到這個小提琴，並告訴我，如果這就是你想要http://jsfiddle.net/pGSAR/6/