爲什麼這兩個圖層不會相互漂浮？

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; } 根據需要將其添加到其他元素。