为什么这两个图层不会相互漂浮？

Question

我试图让两个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

Answer 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

Answer 2

尝试设置“显示部”的至少属性到最外部容器。

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