布局乱，怎么都改不过来，请高手帮忙
代码中红色部分为调用的内容，但是在页面上显示的布局是乱的，如下图所示，
应该是横着排 ：发布人：个人 中介
户型：一室 两室 三室 四室
房屋配置：自来水 ... .... .....
代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta http-equiv="Content-Language" content="gb2312">
<meta name=keywords content="{$Meta_Keywords}">
<meta name="description" content="{$Meta_Description}">
<link rel="SHORTCUT ICON" href="{$InstallDir}images/favicon.ico">
<link rel="Bookmark" href="{$InstallDir}images/favicon.ico">
<link type="text/css" rel="stylesheet" href="{$InstallDir}Skins/{$SkinDir}/skins/_g.css">
<link type="text/css" rel="stylesheet" href="{$InstallDir}Skins/{$SkinDir}/skins/style.css">
<link type="text/css" rel="stylesheet" href="{$InstallDir}Skins/{$SkinDir}/skins/_liveNews.css">
<Script language="JavaScript" Src="{$InstallDir}Inc/Site.Js"></Script>
<script type="text/javascript" src="{$InstallDir}Skins/{$SkinDir}/js/jquery.js"></script>
<link id="themecss" rel="stylesheet" rev="stylesheet" href="{$InstallDir}Skins/{$SkinDir}/skins/theme/theme1.css" type="text/css">
<script>loadss();</script>
<title>{$ClassName} - {$SiteTitle}</title>
</head>
<body class="home-page" bgcolor="#e6e6e6">
{$My_Hand_分类信息}
<!-- 主体 -->
<div id="content">
<!-- 小图banner -->
<div class="top6">
<div class="hd"><img src="../skins/dg13/images/live_new72_03.gif" alt="top6推荐" /></div>
<div class="bd">
<ul class="clearfix">
{$Mr_top}
</ul>
</div>
<div class="ft"><a href="../about/ads.html" target="_blank">参与竞价</a></div>
</div>
<div class="page_nav">
<div class="menu left" id="LeftArr"><a href="javascript:void(0);">左移</a></div>
<div class="bd clearfix" id="ISL_Cont_1">
<ul>
<li class="selected"><a href='../Class_1_1_0/'>房屋信息</a></li>
<li><a href='../Class_8_1_0/'>二手市场</a></li>
<li><a href='../Class_24_1_0/'>征婚交友</a></li>
<li><a href='../Class_31_1_0/'>车辆信息</a></li>
<li><a href='../Class_38_1_0/'>招聘求职</a></li>
<li><a href='../Class_76_1_0/'>生活服务</a></li>
<li><a href='../Class_68_1_0/'>同城活动</a></li>
<li><a href='../Class_59_1_0/'>兼职信息</a></li>
<li><a href='../Class_89_1_0/'>教育培训</a></li>
<li><a href='../Class_86_1_0/'>企业服务</a></li>
</ul>
</div>
<div class="menu right" id="RightArr"><a href="javascript:void(0);">右移</a></div>
</div>
<div class="page_cont clearfix">
<div class="col_sub">
<!-- 类别列表 -->
<div class="category_navigation">
<div class="hd">{$ClassName} 栏目分类</div>
<div class="bd">
<ul>
{$Mr_小类分类列表}
</ul>
</div>
</div>
<!-- 自定html -->
<div class="zd_html">
{$My_google160*600}
</div>
</div>
<div class="col_main bg_open" id="node_box">
<div class="mainBar">
<!-- 头部选择 -->
<div class="top_selsct">
<ul class="clearfix">{$ClassOptionList}
<div class="address">{$My_google468*15}</div>
</ul><div></div></div>
<!-- 内容列表 -->
<div class="zone clearfix" id="node_bg"><div id="list01">{$CycBegin}【20,50,250】<ul>
<div class="list_module">
<div class="hd clearfix"><span class="right_f"><b class="bh">({$PostName})</b> <b class="time">{$Month}月{$Day}日</b></span><span class="lou"><b>{$Lou}</b>楼</span><span class="title"><a href={$Url} target=_blank class=F14>{$Title}</a></span><span class="smallClass"></span></div>
<div class="bd clearfix">
<div class="pic"><img src="{$Pic}" width="52" height="52"/></div>
<div class="cont">
<div class="info">{$Content}</div>
<div class="ft"><span class="right">{$ComSign} {$CommendSign}</span>所属地区：<b class="red_skin">{$AreaName}</b>
回复数：<b class="red_skin">{$Re}</b>
点击次数：<b>{$Hit}</b></div></div></div></div>
</ul>{$CycEnd}
<script Language="Javascript1.2">
objName=document.getElementById("list01").getElementsByTagName("ul")
for (i=0;i<objName.length;i++) {
(i%2==0)?(objName(i).className = "li01"):(objName(i).className = "li02");
}
</script>{$My_列表下500.1}
<div class="pagination_module clearfix" style="margin-top:7px;">
<span class="right2"><a href="#top" style="border:0; color:#36c;">返回顶部 ↑</a></span>
<span style="float:left;">{$NextPage}</span>
</div>
</div></div>
</div>
<div class="sideBar" id="sidebar">
<div><a href="../class/post.asp"><img src="../skins/dg13/images/fabu_06.gif" alt="" border="0" /></a></div>
<!-- 跳蚤市场详细搜索 -->
<div class="searchz_box">
<div class="hd">联盟推广</div>
<div class="bd" style="padding:6px;">
{$My_列表右侧152} </div>
</div>
<!-- 跳蚤市场详细搜索 -->
<div class="searchz_box">
<div class="hd">{$ClassName} 搜索</div>
<div class="bd">
<form action="{$InstallDir}Search/Search.asp" name="myform" method="POST" target="_blank">
<ul>
<li>选区域：{$SCity}
<li>选时间：<select name='youxiao'><option value='0' >不限</option><option value='1' >三天</option><option value='2' >一周</option><option value='3' >一个月内</option><option value='4' >三个月内</option><option value='5' >六个月内</option><option value='6' >一年以内</option></select></li>
<li>关键字：<input name="ClassID" type=hidden ><input name="Type" type=hidden value="Class"><input name="Key" type="text" class=keyinput title="小提示：多个关键词之间请用空格分开" size="13"></li>
<input type="hidden" name="colname" value="1">
<li style="text-align:right;"><input type="submit" class="search_menu" value="搜索" /></li>
</ul>
</form>
</div>
</div>
<div class="searchz_box">
<div class="hd">{$MyCity}{$ClassName}帮助</div>
<div class="bd" style="padding:8px;">
本栏目为大家提供免费查看、免费发布{$MyCity}{$ClassName}的服务，每天都有海量的{$ClassName}信息更新。是寻找{$MyCity}{$ClassName}的最佳平台。
</div>
</div>
<!-- 客服 -->
<div class="service_box">
<span class="tp_bg"></span>
{$My_联系方式1}
<span class="ft_bg"></span>
</div>
<!-- 警察 -->
<div class="jincha"><img src="../skins/dg13/images/p/live_new_70.png" /></div>
<!-- 贴心服务 -->
<div class="searchz_box">
<div class="hd">贴心服务</div>
<div class="bd tiexin" style="padding:8px;">
<ul>
{$My_tiexin}
</ul>
</div>
</div>
</div>
<div class="fter"><a class="menu2" href="javascript:void(0);"><span id="guanbi">关闭边栏</span></a></div>
</div>
</div>
</div>
<!-- 主体 结束 -->
<!-- 页脚 -->
{$My_Bottoms}
<!-- 页脚 结束 -->
<script src="../skins/dg13/js/ScrollPic.js" type="text/javascript"></script>
<script type="text/javascript">
var scrollPic_02 = new ScrollPic();
scrollPic_02.scrollContId = "ISL_Cont_1"; //内容容器ID
scrollPic_02.arrLeftId = "LeftArr";//左箭头ID
scrollPic_02.arrRightId = "RightArr"; //右箭头ID
scrollPic_02.frameWidth = 902;//显示框宽度
scrollPic_02.pageWidth = 90; //翻页宽度
scrollPic_02.speed = 10; //移动速度(单位毫秒，越小越快)
scrollPic_02.space = 10; //每次移动像素(单位px，越大越快)
scrollPic_02.autoPlay = false; //自动播放
scrollPic_02.autoPlayTime = 3; //自动播放间隔时间(秒)
scrollPic_02.initialize(); //初始化
</script>
<script type="text/javascript" src="../skins/dg13/js/hover_bg.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.menu2').click(function(){
$('#node_box').toggleClass('bg_close');
if($$("guanbi").innerHTML=="打开左栏"){
$$("guanbi").innerHTML="关闭左栏";
}
else{
$$("guanbi").innerHTML="打开左栏";
}
});
});
</script>
</body>
</html> --------------------编程问答-------------------- 布局乱就慢慢改嘛，有啥问题的。。 --------------------编程问答--------------------
--------------------编程问答--------------------
图片在这里
--------------------编程问答--------------------
弄了好久 就是改不过来啊 --------------------编程问答-------------------- 不是很乱吧 --------------------编程问答--------------------
我想要的效果是横着排
发布人：个人 中介
户型：一室 两室 三室 四室
房屋配置：自来水 ... .... .....
不是
发布人：
个人
中介
户型：
一室
两室
三室
四室
房屋配置：
自来水
...
....
.....
--------------------编程问答-------------------- 可以去像Dreamweave这些软件中该布局嘛 --------------------编程问答--------------------
<ul class="clearfix">{$ClassOptionList}
是调用过来的数据在dw里没有办法改啊 --------------------编程问答-------------------- 太长了 把你想要横排的HTML 发一遍 --------------------编程问答--------------------
<!-- 自定html -->--------------------编程问答--------------------
<div class="zd_html">
{$My_google160*600}
</div>
</div>
<div class="col_main bg_open" id="node_box">
<div class="mainBar">
<!-- 头部选择 -->
<div class="top_selsct">
<ul class="clearfix">{$ClassOptionList}
<div class="address">{$My_google468*15}</div>
</ul><div></div></div>
你真牛！！！
这叫人怎么改。。。
你还得把几个相关的样式也贴出来才行 --------------------编程问答-------------------- 在设计的时候最好不要拖动，设置好代码固定值，不然在不同显示器中会有不同的显示样式 --------------------编程问答-------------------- 没有你这样问问题的
把一大堆代码原封不动地抛上来就问人家怎么办
繁多而且没有个重点，谁有那个闲心看呀。
该贴的却又不贴，相关的css类也没贴出来。
推荐你搜一篇文章看看：《提问的技巧》。
怀疑你甚至都不知道css是什么，因为很难相信一个具有相关的最基础的知识的人问这类问题时会不把css给出来。如果基础知识太差的话就不要上论坛问人了，先买本入门教材好好看看吧。
最后，可以试着把相关的类设置为width:0; float:left，或者把div改为span，也不知你是否看得懂 --------------------编程问答-------------------- 把你需要设置为横排的内容里加个div，设置为float：left，我就是这样子做的。 --------------------编程问答--------------------
我看代码头疼 --------------------编程问答-------------------- 顶13 ， 这里涉及到 div+css 。跟.net没什么关系. --------------------编程问答-------------------- 一般这样的，交给别人也麻烦。。干脆你就重新写吧。。架构。。
补充：.NET技术 , ASP.NET
