div中float，div换行的问题 30
<htmllang="zh-cn"><head><metahttp-equiv="Content-Type"content="text/html;charset=UTF8...
<html lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF8" />
<style type="text/css">
body{background-color:#ffffff;margin:0;padding:0;font-family:Arial, Helvetica, Geneva;font-size:10px;}
div.dhtmlMenuLG{white-space:nowrap;clear:both;}
div.dhtmlMenuLG div.dhtmlMenuItem{float:left;text-align:center;margin:0 15px 0 0;font-size: 12px;}
</style>
<title></title>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" height="70%">
<tr>
<td valign="top" width="100%">
<div class="dhtmlMenuLG">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">疯狂</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">发生的</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">发多少</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">现场v</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">士大夫</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">一二三</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">一二三</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">士大夫</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">沃尔</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">阿方索</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">发生的</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">很健康</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">体育</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">沃尔</a>
</div>
</div>
</td>
</tr>
</table>
</body>
</html>
上面是html文件代码，下面是效果，我想问的是，为什么自动排列的div第二行不是从最左边开始的呢，请高人指点，谢谢了
sky94羽 , wuniuu 二位说的我都试了，TEXT-ALIGN:LEFT 放到body{}
div.dhtmlMenuLG{}
div.dhtmlMenuLG div.dhtmlMenuItem{} 还有 放到table中我都试过了，不行啊 展开
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF8" />
<style type="text/css">
body{background-color:#ffffff;margin:0;padding:0;font-family:Arial, Helvetica, Geneva;font-size:10px;}
div.dhtmlMenuLG{white-space:nowrap;clear:both;}
div.dhtmlMenuLG div.dhtmlMenuItem{float:left;text-align:center;margin:0 15px 0 0;font-size: 12px;}
</style>
<title></title>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" height="70%">
<tr>
<td valign="top" width="100%">
<div class="dhtmlMenuLG">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">疯狂</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">发生的</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">发多少</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">现场v</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">士大夫</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">一二三</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">一二三</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">士大夫</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">沃尔</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">阿方索</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">发生的</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">很健康</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">体育</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<br />
<a href="#" class="noVisit">沃尔</a>
</div>
</div>
</td>
</tr>
</table>
</body>
</html>
上面是html文件代码，下面是效果，我想问的是，为什么自动排列的div第二行不是从最左边开始的呢，请高人指点，谢谢了
sky94羽 , wuniuu 二位说的我都试了，TEXT-ALIGN:LEFT 放到body{}
div.dhtmlMenuLG{}
div.dhtmlMenuLG div.dhtmlMenuItem{} 还有 放到table中我都试过了，不行啊 展开
4个回答
展开全部
<html lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF8" />
<style type="text/css">
body{background-color:#ffffff;margin:0;padding:0;font-family:Arial, Helvetica, Geneva;font-size:10px;}
div.dhtmlMenuLG{clear:both;}
div.dhtmlMenuLG div.dhtmlMenuItem{float:left;text-align:center;margin:0 15px 0 0;font-size: 12px;}
div.dhtmlMenuLG div.dhtmlMenuItem A{display:block}
</style>
<title></title>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" height="70%">
<tr>
<td valign="top" width="100%">
<div class="dhtmlMenuLG">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">疯狂</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发生的</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发多少</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">现场v</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">士大夫</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">一二三</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">一二三</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">士大夫</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">沃尔</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">阿方索</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发生的</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">很健康</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">体育</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">沃尔</a>
</div>
<div style="clear:both;">
</div>
</td>
</tr>
</table>
</body>
</html>
因为你没清除浮动。
我不知道你为什么要这样去，想不通，你这样做没意义知道吗？
一个表格里面去嵌套DIV？再说了，人家DIV本来就是自动左对齐，你非得加个左浮动。
打个比方说第一块DIV1 宽度100px.左浮，第二DIV2 100PX 左浮，如果你不清掉？你觉得他会往左吗？
这样就导致了DIV跟在DIV1的后面，因为最外面的宽度没设定。
你压根就不用浮动都可以实现的效果，非得这样做，诶。写程序，记住：要简洁，实用，别做无偿垃圾代码
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF8" />
<style type="text/css">
body{background-color:#ffffff;margin:0;padding:0;font-family:Arial, Helvetica, Geneva;font-size:10px;}
div.dhtmlMenuLG{clear:both;}
div.dhtmlMenuLG div.dhtmlMenuItem{float:left;text-align:center;margin:0 15px 0 0;font-size: 12px;}
div.dhtmlMenuLG div.dhtmlMenuItem A{display:block}
</style>
<title></title>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" height="70%">
<tr>
<td valign="top" width="100%">
<div class="dhtmlMenuLG">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">疯狂</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发生的</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发多少</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">现场v</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">士大夫</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">一二三</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">一二三</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">士大夫</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">沃尔</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">阿方索</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发生的</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">很健康</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">体育</a>
</div>
<div style="clear:both;">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">沃尔</a>
</div>
<div style="clear:both;">
</div>
</td>
</tr>
</table>
</body>
</html>
因为你没清除浮动。
我不知道你为什么要这样去，想不通，你这样做没意义知道吗？
一个表格里面去嵌套DIV？再说了，人家DIV本来就是自动左对齐，你非得加个左浮动。
打个比方说第一块DIV1 宽度100px.左浮，第二DIV2 100PX 左浮，如果你不清掉？你觉得他会往左吗？
这样就导致了DIV跟在DIV1的后面，因为最外面的宽度没设定。
你压根就不用浮动都可以实现的效果，非得这样做，诶。写程序，记住：要简洁，实用，别做无偿垃圾代码
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
看看我的：
<html lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF8" />
<style type="text/css">
body{background-color:#ffffff;margin:0;padding:0;font-family:Arial, Helvetica, Geneva;font-size:10px;}
div.dhtmlMenuLG{white-space:nowrap;clear:both;}
div.dhtmlMenuLG div.dhtmlMenuItem{float:left;text-align:center;margin:0 15px 0 0;font-size: 12px;}
div.dhtmlMenuLG div.dhtmlMenuItem A{display:block}
</style>
<title></title>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" height="70%">
<tr>
<td valign="top" width="100%">
<div class="dhtmlMenuLG">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">疯狂</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发生的</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发多少</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">现场v</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">士大夫</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">一二三</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">一二三</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">士大夫</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">沃尔</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">阿方索</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发生的</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">很健康</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">体育</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">沃尔</a>
</div>
</div>
</td>
</tr>
</table>
</body>
</html>
<html lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF8" />
<style type="text/css">
body{background-color:#ffffff;margin:0;padding:0;font-family:Arial, Helvetica, Geneva;font-size:10px;}
div.dhtmlMenuLG{white-space:nowrap;clear:both;}
div.dhtmlMenuLG div.dhtmlMenuItem{float:left;text-align:center;margin:0 15px 0 0;font-size: 12px;}
div.dhtmlMenuLG div.dhtmlMenuItem A{display:block}
</style>
<title></title>
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" height="70%">
<tr>
<td valign="top" width="100%">
<div class="dhtmlMenuLG">
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">疯狂</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发生的</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发多少</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">现场v</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">士大夫</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">一二三</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">一二三</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">士大夫</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">沃尔</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">阿方索</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">发生的</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">很健康</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">体育</a>
</div>
<div class="dhtmlMenuItem">
<a href="#"><img src="11.jpg" /></a>
<a href="#" class="noVisit">沃尔</a>
</div>
</div>
</td>
</tr>
</table>
</body>
</html>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
因为你用了text-align:center.可以在适当的位置加个TEXT-ALIGN:LEFT;就OK了】
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
应该是你TABLE或者哪个加了居中对齐的属性吧！给div.dhtmlMenuLG加个左对齐的起样式，div.dhtmlMenuLG和 div.dhtmlMenuItem都设置好高宽！或者给TABLE加个左对齐的样式！
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
