2012-08-26 51 views
0

我有以下的HTML排隊:如何獲得DL DDS相互

<html> 
<head> 
<style type="text/css"> 
dt 
{ 
clear:left; 
float:left; 
padding-right:50px; 
} 
</style> 
</head> 
<body> 
<dl> 
<dt>First Answer</dt> 
<dd>Dog</dd> 
<dt>Second Answer</dt> 
<dd>Cat</dd> 
</dl> 
</body> 
</html> 

當你運行它的狗和貓不用排隊。我真的希望得到狗和貓的第一個字母排列在一起。

有誰知道如何設計這個來達到這個目的?

而不是使用表格。

回答

2

您可以在dt元素上設置固定寬度。

dt 
{ 
clear:left; 
float:left; 
width:200px; 
} 
0

這是你更新的HTML/CSS

<style type="text/css"> 
dt{ 
    clear:left; 
    float:left; 
    padding-right:50px; 
    width:200px; 
} 
</style> 
<body> 
    <dl> 
     <dt>First Answer</dt> 
     <dd>Dog</dd> 
     <dt>Second Answer</dt> 
     <dd>Cat</dd> 
     </dl> 
</body> 

這是你更新的代碼...