DL DT DD的布局问题。。。

che2piaopiao 2010-12-20 12:13:32

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style>

.box

{

	background-image:url(Back.gif);

	width:450px;

}



.box dl {

	border:solid 0px #316301;

	margin:0px 0px 0px 0px;

	padding:0px;

	width:450px;

	height:60px;

}



.box dt {

	float:left;

	height:60px;

	width: 60px;

	line-height:60px;

	font-weight:bold;

	text-align:left;

	color:#FF6800;

}



.box dd {

	float:left;

	width:85px;

	height:30px;

	line-height:30px;

	text-align:left;

	font-size:12px;	

}



</style>

</head>



<body>



<div class="box">

 

<!---->

<dl>

<dt><a href="#" style="font-size:12px;color:#FF6800;"> 种苗</a></dt>



<dd><a href="#">种子种苗</a></dd>

<dd><a href="#">种子种苗</a></dd>

<dd><a href="#">种子种苗</a></dd>

<dd><a href="#">种子种苗</a></dd>

<dd><a href="#">种子种苗</a></dd>

<dd><a href="#">种子种苗</a></dd>

<dd><a href="#">种子种苗</a></dd>

<dd><a href="#">种子种苗</a></dd>	 

</dl>



</div>

 

 

</body>

</html>

结果有两个种子种苗换行了。。。

我就想要两行。。每行四个。。

...全文

157 5 打赏收藏转发到动态举报

写回复

用AI写文章

5 条回复

切换为时间正序

请发表友善的回复…

发表回复

86y 2010-12-21

打赏
举报

[Quote=引用 3 楼 houtianfu 的回复:]
把.box dd里面的width：85删掉就行了
[/Quote]
简单。。不用改太多!

ajccom 2010-12-20

打赏
举报

.box dd {
float:left;
height:30px;
line-height:30px;
text-align:left;
font-size:12px;
width:30px;
overflow:hidden;
}

yhtapmys 2010-12-20

打赏
举报



.box dd {

    float:left;

    height:30px;

    line-height:30px;

    text-align:left;

    font-size:12px;    

}

beyond_me21 2010-12-20

打赏
举报

.box dt {
float:left;
height:60px;
width: 60px;
line-height:60px;
font-weight:bold;
text-align:left;
color:#FF6800;
margin:0;
padding:0;
}

.box dd {
float:left;
width:85px;
height:30px;
line-height:30px;
text-align:left;
font-size:12px;
margin:0;
padding:0;
}