Div圍繞定義列表崩潰

Question

我正在爲博客設計一個元數據區域，並且在正確格式化時遇到了一些問題。

我有3個包含在Div中的定義列表。該部門不會兌現我在DL項目上的填充。我已經鏈接到一張照片來演示。第一張圖片顯示了什麼看起來是正確的格式。這是因爲Div和DL的填充是相同的。但是，正如第二幅圖所示，當我增加DL的填充時，容器部門並不尊重它。

值得注意的是，我使用display：inline，而不是在這裏漂浮。

http://gettinderbox.com/blogdesign/i/busted.gif

.post_meta { 
padding: 8px 0 7px 0; 
margin: 20px 0; 
border-top: 1px solid #dddcdc; 
border-bottom: 1px solid #dddcdc; 
display: block; 
} 

.post_meta dl { 
display: inline; 
border-right: 1px solid #dddcdc; 
margin-right: 10px; 
padding: 20px 5px 20px 0; 
} 

.post_meta dt { 
font-weight: bold; 
margin-right: .1em; 
display: inline; 
} 

.post_meta dd { 
display: inline; 
} 

.post_content { 
display: inline; 
} 

<div class="post_meta"> 
<dl> 
<dt>August 10, 2010</dt> 
</dl> 
<dl> 
<dt>Posted By</dt> 
<dd><a href="">Dustin Sapp</a></dd> 
</dl> 
<dl> 
<dt>Posted In</dt> 
<dd><a href="http://">Proposals</a>, <a href="http://">Editing</a></dd> 
</dl> 
</div><!-- END POST_META --> 

Answer 1

如何使用inline-block代替inline？