排队多个dd标签

我有一个dl，其中dt可能有多个我想排队的dd。不幸的是，第二条生产线向左移动。如何调整造型以防止这种情况发生？我无法编辑HTML，因为我从应用程序中获得它，这仅仅是一个示例，每页有6到10个dt标签，它们具有多个dd，因此这必须是一个通用的解决方案。排队多个dd标签

<head> 
<style type="text/css"> 
dl { 
width:450px; 
overflow:hidden; 
background:#ff0; 
} 
dt { 
padding:0 4px 0 4px; 
float:left; 
width:125px; 
background:#cc0; 
clear: left; 
text-align: right; 
} 
dd { 
padding:0 4px 0 4px; 
margin: 0; 
float:left; 
width:250px; 
background:#dd0; 
} 
</style> 
</head> 
<body> 
    <h3>Test McTesterson</h3> 
    <dl> 
     <dt>Personal Phone</dt> <dd>555-555-5555</dd> 
     <dt>Personal Email</dt> <dd>[email protected]</dd> 
     <dt>Address</dt> <dd><span>123 Main St</span></dd><dd> <span>Cityburg</span> <span>Qa</span> <span>12345</span></dd> 
     <dt>Birthdate</dt> <dd>198</dd> 
    </dl> 
<body>

来源

2010-12-07 Tyson of the Northwest

出于好奇，这个问题解决了您的满意吗？或者在发布的解决方案中存在突出问题？ – 2012-07-22 22:34:02

方式一：

dd + dd { 
    display: block; /* to force new line */ 
    margin: 0 0 0 4em; /* whatever the width of dt */ 
}

来源

2010-12-07 22:36:41

这可能是最好的选择，假设IE6不需要支持（因为它应该是）。 – BoltClock 2010-12-07 22:38:03

你也不能使用多个dd的，只是把所有的信息到一个单一的dd。

来源

2010-12-07 22:41:57 matthewpavkov

除了我从应用程序获得dd，我真的不想写更改标签的东西，因为它们包含一些JavaScript依赖的类属性，这里没有显示。 – 2010-12-07 23:55:37

排队多个dd标签

回答

相关问题