css，重新調整內嵌元素以適合塊寬度

Question

我需要對齊兩個不同div元素中的元素。

我的CSS

div.details-box {  
     display:inline-block; 
     *display:inline; 
     width:850px;  
     margin-right:100px; 
     margin-left:200px; 
     margin-top:50px; 
     border:1px solid #000; 
     background:#eee; 
     border-radius:5px; 
     -moz-border-radius:5px; 
     direction:rtl;  
    } 
    div.details-box div.row 
    { 
     display:block;  
     width:850px; 
     margin:auto; 
     margin-bottom:8px;    
     border:2px solid red; 
     padding-right:150px; 
    } 
    div.details-box div.row div.inline-wraper 
    { 
     display:inline-block; 
     width:250px; 
     border:1px solid blue;  
    } 

我的html：

<div class="details-box"> 
    <div class="row"> 
     <div class="inline-wraper"> 
      <span> element 1 </span> 
      <asp:TextBox ID="txt_pwd" runat="server" TextMode="Password"></asp:TextBox> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="inline-wraper"> 
      <span> element 2 </span> 
      <asp:TextBox ID="txt_pwd" runat="server" TextMode="Password"></asp:TextBox> 
     </div> 
    </div> 
</div> 

的2對齊直列wrapers

我正在尋找一種方式來重新爲例調整我的跨度，以便內聯包裝可以在對方頂部或某個不同的應用上「對齊」將其與歸檔的蟑螂一起玩填充 的頂部，以適應包裝的全部寬度（原因是這是一個重複發生的問題）。

我希望這已足夠清晰 在此先感謝 eran。

Answer 1

不知道我是否清楚地理解你的問題。

無論如何，如果你不關心具有固定寬度爲您的跨度，你可以使用：

span { 
    width: 90px; 
    float: right; 
} 

如果固定的寬度是一個問題，也許你可以使用一個<table>。