css - 为什么这个元素不会出现在它的兄弟元素旁边？

Question

我正在尝试让#subwrapper 和#submission_message 并排出现，并使用#vert_center 作为一种将它们固定在一起的“轨道”，在页面上垂直居中。但是，#submission_message 继续直接加载到#subwrapper 下，好像是清空left 什么的。帮忙？

CSS:

#floater{
   position:relative;
   float: left;
   height:50%;
   margin-bottom: -155.5px;
   width:1px;
}

#vert_center{
  position: relative;
  clear: left;
  width:100%;
  height:315px; 
}

#subwrapper{
  display:block;
  background-color:#FFFFFF;
  position:relative;
  width:600px;
  height:315px;
  margin: 0 auto;

#submission_message {
  position:relative;
  width:600px;
  height:315px;
  margin: 0 auto;
}

基本 HTML:

<div id=floater></div>
<div id=vert_center>
  <div id=subwrapper>BlaBla1</div>
  <div id=submission_message>BlaBla2</div>
</div>

Answer 1

div#submission_message 应该出现在 div#subwrapper 下——它们都是 block 元素，这就是 block 元素在它们的容器内流动的方式(它们的容器是 div#vert_center)。如果您希望它们彼此相邻，则将它们漂浮在容器中