为dl标签设置浮动即可啊
范例代码如下（在实际开发当中，记得先引入CSS重置文件，此处只给出的是核心功能代码）
<style>.list {
width: 800px
height: 400px
border: 4px solid black
}
.list dl {
float: left
width: 300px
height: 200px
border: 2px solid red
}
</style>
<div class="list">
<dl>
<dt>自定义列表的标题</dt>
<dd>自定义列表的内容</dd>
</dl>
<dl>
<dt>码匠</dt>
<dd>h5course</dd>
</dl>
</div>
做网页布局之前建议先掌握盒模型、浮动等相关知识。可以借助《HTML5布局之路》等书籍进行系统化的学习。
dl dt dd的结构和table是不一样的。在一个表格元素中，table包含tr，tr包含td；在一个dl结构中，dl包含dt和dd，但dt和dd不是相互包含的关系，而是同级关系，就像下面这样：<dl>
<dt></dt>
<dd></dd>
<dd></dd>
<dt></dt>
<dd></dd>
<dd></dd>
<dl>
dl标签的确切意思是“一个自定义的列表”，dt是列表中的项目名称，dd是列表项目的描述。所以在一个标准的DL列表里面不存在dt和dd相互包含的情况，自然也不能做出等价于table的多列表格的效果。但是在形态上与表格相似或者相同是可以的，这也不是dl列表的专利，div、ul这些也能做到，不是什么奇怪的事情。
不过话说回来，如果硬要让dt包含dd，似乎也未尝不可，例如像下面这样
<dl>
<dt>
<dd></dd>
<dd></dd>
</dt>
<dt>
<dd></dd>
<dd></dd>
</dt>
<dl>
这样就把table的结构给模拟出来了，每个DT相当于表格中的一行或者一列，每个DD相当于一个单元格，然后定义DT或者DD 的宽高，同时加一句display:inline-block就可以了，似乎这样在道理上也是可行的，不过不符合规范罢了。
直接用标签选择器定义全局的dl样式，如：dl{width:200pxheight:200px
border:1px
solid
blue}则页面中所以dl都会变成宽为200像素，高为200像素，并带1像素的蓝色边框
