css問題獲取顯示圖像在左側CSS。 asp.net

Question

我有一個在asp.net中顯示女孩圖像的問題。我想達到以下結果：

的問題是，如下所示女孩的臉上沒有出現：

這裏是我做的CSS：

.testimonialstilabel { 
    background-image: url(../images/testimonialstilabel.png); 
    height: 100px; 
} 
.testimonialstilabelback { 
    background-image: url(../images/testimonialstilabel2.png); 
    height: 253px; 
    width: 500px; 
} 
.imgeCoverBack { 
    height: 149px; 
    width: 107px; 
    position: absolute; 
    top: 112px; 
    left: 22px; 
} 
.imgeCover { 
    background-image: url(../images/testimonialstilabelimg.png); 
    height: 216px; 
    width: 138px; 
    position: absolute; 
    top: 109px; 
    left: 6px; 
} 

這裏是一個asp.net代碼低於

<div class="container clearfix"> 
      <div class="testimonialstilabel"> 
       <br> 
       <h2 align="center"> 
        Great things people are saying about us</h2> 
      </div> 
      <asp:DataList ID="DataListT" runat="server" RepeatDirection="Horizontal" RepeatColumns="2" 
      Width="100%"> 
      <ItemTemplate> 
      <div class="testimonialstilabelback"> 
       <asp:Image ID="Image2" runat="server" ImageUrl='<%#Eval("ImageUrlPath")%>' class="imgeCoverBack"/>     
       <div class="imgeCover"> 
       </div> 
       <p style="width: 300px; margin-left: 150px; height: 175px; margin-top: 0px; padding:17px 0px 0px 0px""> 
        <%#Eval("Description")%> 
       </p> 
       <p style="text-align: justify; font-weight: bold; width: 300px; margin-left: 150px; 
        color: #74a6a5; padding: 0px 0px 0px 5px;"> 
        &#8226; <%#Eval("Name")%> 
       </p> 
      </div> 
      </ItemTemplate> 
     </asp:DataList> 
     </div> 

我知道我的CSS存在問題。請幫我解決我在做什麼錯誤。有沒有人對此有任何想法？

Answer 1

嗨，你正在使用position:absolute這意味着該元素正在搜索他的最接近的父母與聲明定位非絕對位置。

你需要作出相對直接父在這種情況下，你的元素被

<div class="testimonialstilabelback">

請在CSS

.testimonialstilabelback { 
    background-image: url(../images/testimonialstilabel2.png); 
    height: 253px; 
    width: 500px; 
    position:relative; 
}