2011-09-05 74 views
0

圖像勝過千言萬語,所以這裏是一個:表格單元不能在IE中工作,有什麼想法?

enter image description here

上的圖像是corect版本,我使用的顯示:表單元格,以避免在IE7第二圖像中會發生什麼。你建議用什麼來避免這種情況?

下面是使用的代碼:

<div class="sharerDataContainer"> 

    <img src="http://tctechcrunch2011.files.wordpress.com/2011/09/perfectworld.png?w=145" width="90" alt="Andrew" /> 

    <div class="sharerData"> 

       <p class="sharerDataTitle"> 
           <a href="http://example.org" target="_blank"> 
               Website Title Here 
           </a> 
       </p> 


       <p class="sharerDataAddress"> 
           mbac.squarespace.com 
       </p> 


       <p class="sharerDataDescription"> 
         Congratulations to Rachel Edwards, who won a fabulous Bloom Tea Treatment Box Set (worth £20) from our friends at Running Cupcake 
       </p> 

    </div> 

    </div> 

UPDATE:

CSS代碼:

.sharerDataContainer img { 
    float: left; 
} 

.sharerData { 
    background: none repeat scroll 0 0 transparent; 
    border: 0 solid #0077A5; 
    color: #808080; 
    display: table-cell; 
    font-size: 11px; 
    line-height: 15px; 
    padding: 0 10px !important; 
    position: relative; 
} 

.sharerData .sharerDataDescription { 
    margin-top: 5px; 
} 
+0

我們可以看看你的css嗎? – Tsar

+0

你的問題很混亂。你問爲什麼'display:table-cell'在IE7中不起作用?你在問如何讓它看起來像所有瀏覽器中的第一個截圖? – thirtydot

+0

@Tsar完全添加了CSS代碼 – Andrew

回答

1

簡單的跨瀏覽器的解決方案是包裹圖像中的另一個div ision標籤:

<div class="imgContainer"> 
    <img src="" width="90" alt="Andrew" /> 
</div> 

,並讓它浮動:

.sharerDataContainer .imgContainer { 
    float: left; 
} 

嘗試一下! http://jsfiddle.net/9U7e9/

+0

是的,謝謝。這也適用:) – Andrew

+0

@Tsar:只是爲了您的信息,這不太現實。在IE7中檢查它:http://jsfiddle.net/9U7e9/1/(我只是添加了一些額外的文本) – thirtydot

相關問題