擴展div中的內容時出錯

Question

我正在嘗試通過未定義特定高度來擴展div的內容。現在，內容與div一起展開，但顯示不正常，因爲背景圖像顯示出來而不是被div覆蓋。我該如何解決這個問題？找到附加的圖像。

HTML代碼

<div class='user_container'> 
       <div class='user_sec_teams col-md-4'> 
        <div class='inner_sec'> 
        <ul> 
       <span class='points'> Title: </span> {$result['title']}</br> 
       <span class='points'> Description: </span> {$result['description']}</br></br> 

       <li class='button1' style='color:#A52A2A;'> <a href='' data-toggle='modal' data-target='#{$result['id']}' class='' style=' text-decoration:none; color:#A52A2A;'>Delete Thread</a></li> 

       <li class='button2' style='color:#DC143C;'><a href='viewcircle.php?id={$result['id']}' style='text-decoration:none; color:#DC143C;'>View Thread</a></li>  
        </ul> 
        </div> 
       </div> 
    </div> 

---

CSS代碼

.user_container{ 
    width: 100%; 
    padding-left: 130px;  
} 
.user_sec_teams{ 
width: 350px; 
height: 0px; 
font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif; 
font-size: 15px; 
padding-left: 10px; 
background: #fff; 
} 
.inner_sec img{ 
border: 1px solid #ccc; 
height: 70px; 
width: 70px; 
} 
.inner_sec img{ 
    vertical-align: middle; 
    margin:5px; 
} 
.inner_sec p{ 
    background: #eee; 
} 
.inner_sec ul li{ 
    list-style: none; 
    display: inline; 
    left:0; 
    position: relative; 
    padding: 0; 
    margin: 0; 
} 
.inner_sec ul{ 
    padding: 0; 
    margin: 0; 
} 
.inner_sec button{ 
    color: #fff; 
    background:deepskyblue; 
    outline: none; 
    width: 12%; 
    height: 3%; 
    border: 1px solid deepskyblue; 
    border-radius:27px; 
    box-shadow: 0px 1px 1px #ccc; 
    cursor: pointer; 
    font-weight: bold; 
    font-family: georgia; 
} 
.inner_sec button:hover{ 
    box-shadow: 0px 0px 3px 3px #ccc; 
} 

Answer 1

這裏使用的是引導的網格！這些網格擁有浮動的屬性，這使得它們彼此相鄰排列。

根據代碼，<div class='user_sec_teams col-md-4'>三個DIVS彼此相鄰排列。還有一件事是; 「浮動元素不會在意高度。」所以，當你使用浮動網格，你應該適當的安排指定的高度！

你給固定的高度，但

• 實際問題，你說明是背景圖像顯示出來..！

爲此，提供一種背景顏色爲母體&使用clearfix 3 <div class='user_sec_teams col-md-4'>後..

添加下面線用於提供clearfix <div class="clearfix"></div>

所以，你的代碼看起來應該像

<div class='user_sec_teams col-md-4'></div> 
<div class='user_sec_teams col-md-4'></div> 
<div class='user_sec_teams col-md-4'></div> 
<div class="clearfix"></div> 
<div class='user_sec_teams col-md-4'></div> 
<div class='user_sec_teams col-md-4'></div> 
<div class='user_sec_teams col-md-4'></div> 
<div class="clearfix"></div> 

然後，CSS屬性

請爲母公司提供的背景色，而不是<div class='user_sec_teams col-md-4'>本身。