Question

DIV+CSS布局问题？如何使DIV表格横排列

这段代码是（高30，宽200）的DIV表格，里面包括两个（高30，宽80的）DIV表格.
问题输出的是“222_DIV”“333_DIV”DIV表格是上下排列的，我想让他左右排列，需要怎么修改呢？？就是想不通
请帮我说明下，
<style type="text/css">
#111 {
height: 30px;
width: 200px;
}
#222 {
height: 30px;
width: 80px;
}
#333 {
height: 30px;
width: 80px;
}
.h {
font-size: 12px;
line-height: 30px;
}
.j {
border: 1px dashed #CCCCCC;
}
</style>
<div id="111" class="j"align="center">
<div id="222" class="h j">这是222_DIV</div>'
<div id="333" class="h j">这是333_DIV</div>'
</div>

Answer 1

div 肯定是要换行的, 有三种办法:

1.里面的DIV用span来代替. SPAN不换行.

<div id="111" class="j"align="center">
<div id="222" class="h j">这是222_DIV</div>'
<div id="333" class="h j">这是333_DIV</div>'
</div>

2.如果只是两个DIV(没有那两个引号), 可以在CSS里增加float参数, 如222里加上 float:left; 333里加上 flat:right;

#222 {
float: left;
height: 30px;
width: 80px;
}
#333 {
float: right;
height: 30px;
width: 80px;
}

3.把里面的两个DIV放在表格里(不过既然你用DIV就不想用表格了)(同样只是两个DIV,没有那两个引号).

<div id="111" class="j"align="center">
<table border=0>
<tr><td>
<div id="222" class="h j">这是222_DIV</div>'
</td><td>
<div id="333" class="h j">这是333_DIV</div>'
</td></tr>
</table>
</div>

Answer 2

div 肯定是要换行的, 有三种办法:

1.里面的DIV用span来代替. SPAN不换行.

<div id="111" class="j"align="center">
<div id="222" class="h j">这是222_DIV</div>'
<div id="333" class="h j">这是333_DIV</div>'
</div>

2.如果只是两个DIV(没有那两个引号), 可以在CSS里增加float参数, 如222里加上 float:left; 333里加上 flat:right;

#222 {
float: left;
height: 30px;
width: 80px;
}
#333 {
float: right;
height: 30px;
width: 80px;
}

3.把里面的两个DIV放在表格里(不过既然你用DIV就不想用表格了)(同样只是两个DIV,没有那两个引号).

<div id="111" class="j"align="center">
<table border=0>
<tr><td>
<div id="222" class="h j">这是222_DIV</div>'
</td><td>
<div id="333" class="h j">这是333_DIV</div>'
</td></tr>
</table>
</div>

Answer 3

没那么麻烦 加个float就可以了叫它怎么排版布局 就怎么排版布局--->
#222 {
height: 30px;
width: 80px;
float:left;
}
#333 {
height: 30px;
width: 80px;
float:right;
}
不加浮动你的效果肯定是上下布局...

Answer 4

楼上说的比较详细，通常用第二种方法比较好。符合CSS规范。

Answer 5

<span id="222" class="h j">这是222_DIV</span>' <span id="333" class="h j">这是333_DIV</span>'