子div不掩蓋父div雖然高度和寬度是相同的

我有一個父div作爲背景，當點擊子div時。運行代碼來查看我的意思。背景是綠色的。雖然父級和子級div具有相同的高度和寬度，但我可以看到子div背後的父級div的輪廓。它幾乎就像一個邊界。我如何確保孩子div精確地覆蓋父div？子div不掩蓋父div雖然高度和寬度是相同的

.text-body-50 {display: flex; 
 
    flex-wrap:wrap; 
 
    justify-content:center; 
 
    width: 100%; 
 
    height: 50%; 
 
    margin 0 auto;} 
 

 
.one-third-text {width: 33.3333%;height: 50%; 
 
    text-align:center; 
 
    display:flex; 
 
    align-items:center; 
 
    justify-content:center; } 
 

 
.text-btn-bg { background: #2ecc71; height:100%; width:100%; } 
 

 
.text-btn { 
 
    display:table;height:100%; width:100%;background:#f6f6f6; 
 
    margin-right: 0px; 
 
    cursor: pointer; 
 
    margin: 0 auto; 
 
    -webkit-transition: -webkit-transform .07s ease-out; 
 
    -moz-transition: -moz-transform .07s ease-out; 
 
    -o-transition: -o-transform .07s ease-out; 
 
    transition: transform .07s ease-out; 
 
} 
 

 
.text-btn:active, .text-btn.text-btn-android { 
 
    -webkit-transform: scale(0.9, 0.80); 
 
    transform: scale(0.90, 0.80); 
 
    /*opacity: 0.80;*/ 
 
    color:#2ecc71; 
 
    -webkit-tap-highlight-color: rgba(0,0,0,0); 
 
}

<div class="text-body-50"> 
 
     <div class="one-third-text"> 
 
      <div class="text-btn-bg"> 
 
       <div class="text-btn" > 
 
        <h3 class="h3-text-btn">haha</h3> 
 
       </div> 
 
      </div> 
 
     </div> 
 
</div>

來源

2016-06-17 user1038814

由於您的代碼段不顯示的問題..它是最有可能是由於一些地方其他CSS。 – Scott

我同意。其他地方有一些代碼爲這些元素之一添加了填充或邊距 –

我不知道它是否是Mac OS/Safari問題。 – user1038814

嘗試添加

.h3-text-btn { 
    margin: 0; 
    padding: 0; 
}

來源

2016-06-17 23:24:01 Johannes

子div不掩蓋父div雖然高度和寬度是相同的

回答

相關問題