兩個div之間的差距

Question

我遇到了兩個div標籤之間存在gap的問題。這裏是我的代碼 - 我試圖手動覆蓋與兩個div相關聯的邊距/填充，看起來沒有幫助。

這裏的CSS樣子

.left_block{ 
    display: inline-block; 
    background-color: blue; 
    width:40%; 
    height: 2em; 
    margin: 0px; 
    margin-right: 0px; 
    padding-right: 0px; 
    border-width: 0px; 
    overflow: hidden; 
} 

.right_block{ 
    margin: 0px; 
    display: inline-block; 
    background-color: red; 
    width: 59%; 
    height: 2em; 
    margin-left: 0px; 
    padding-left: 0px; 
    border-width: 0px; 
    overflow: hidden; 
} 

這裏的HTML部分

<div class="playground"> 
     <div class = 'left_block'></div> 
     <div class = 'right_block'></div> 
... 

我缺少什麼？

Answer 1

如何使用float屬性？會不會是你的CSS問題？

.left_block { 
 
    display: inline-block; 
 
    background-color: blue; 
 
    width: 40%; 
 
    height: 2em; 
 
    margin: 0 auto; 
 
    padding: 0; 
 
    float: left; 
 
} 
 
.right_block { 
 
    display: inline-block; 
 
    background-color: red; 
 
    width: 60%; 
 
    height: 2em; 
 
    margin: 0 auto; 
 
    padding: 0; 
 
    overflow: hidden; 
 
    float: left; 
 
}

<div class="playground"> 
 
    <div class='left_block'></div> 
 
    <div class='right_block'></div> 
 
</div>