将块级元素的css格式设置为float：left/right，比如，有两个panel，panelA和panelB，想要使其位于同一行，只需要设置A的css格式为float：left/right即可。
注意：只是设置A的float属性哦，若设置了B的float属性，则B后面的元素也会与其位于同一行。若使用该方法，则两个块级元素紧挨着。
2.设置display
display为inline-block，即编写css代码为display:inline-block.使用该方法，两个块级元素中间有一定间隔。
注意，该方法与上一方法相同，仍然需要设置A的display属性，而非B的属性。
这是层级概念.window 楼下的 .window-header 楼下的 .panel-tool 才会吃进 { top: 4pxright: 5px} 的样式属性
简单说，尽管 .panel-tool 有很多个，若果没有父辈 .window-header 和 .window 的话，也不会被分配这个样式
<!-- Html布局：--><div class="panel1">
<div class="inside show">
<p>规则<br />
1.点击【开始】......<br />
2.请在输入框.....<br />
3.这是系统......
</p>
</div>
</div>
<div class="panel2">
<p>请点击【开始】按钮开始游戏：<input type="button" value="开始" class="start" /></p>
<p>请在输入框输入您的估计价格：<input type="text" /><input type="button" value="确定" /></p>
</div> /* CSS代码 */
.panel1{
float:left
width:100% /* 或者一个实际的像素，如1000px */
height:100px /* 实际高度，不要auto */
overflow:hidden /* 可选 */
}
.panel1 .inside{overflow:hidden}
.panel2{
float:left
text-align:right
}
.show{display:block}
.hide{display:none} /* 不清楚你是否使用jquery或者其他js库或者纯javascript，这里提供jquery方法 */
$(document).ready(function(e){
$('.start').click(function(){
$('.panel1 .inside').addClass('hide')
})
})
不清楚欢迎追问。
