为什么这两层不是彼此相邻?

时间:2012-12-28 23:24:37

标签: css

我正试图让两个div显示在一起,我甚至将它们浮起来没有运气。那是为什么?

<div class="popup-container">
  <div class="popup-header">
      <div class="popup-image-holder"></div>

    <div class="image-titles">Content for  class "image-titles" Goes Here</div>
  </div>
</div>


.popup-container {
    padding: 0px;
    width: 764px;
}
.popup-header {
    background-color: #000;
    padding: 21px;
    height: 243px;
    width: 100%;
    overflow: hidden; /* add this to contain floated children */
}
.popup-image-holder {
    float; left;
    background-color: #FFF;
    height: 165px;
    width: 165px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
    padding-top: 5px;
    padding-left: 5px;
}
.image-titles {
    float: left;
    height: 100%;
    width: 300px;
    background-color: #666;
}

由于 修改:JsFiddle

2 个答案:

答案 0 :(得分:1)

尝试将'display'属性设置为最外面的容器。

例如: .popup-container { display: block; padding: 0px; width: 764px; } 根据需要将其添加到其他元素。

答案 1 :(得分:1)

嗯。你错了;而不是:在popup-image-holder div中试试这个

  .popup-image-holder {
float: left;
background-color: #FFF;
height: 165px;
width: 165px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
padding-top: 5px;
padding-left: 5px;
}

小提琴here