IE橫向滾動問題

滾動div時，表格單元格會移動，但單元格文本與頁面保持相同的位置。單元格文本應該與單元一起滾動，即使它在相對格中。IE橫向滾動問題

該問題只能在IE瀏覽器中看到（至少IE7）。該示例在Chrome和Firefox中運行正常。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
     <title>IE Bug Demo</title> 
    </head> 
    <body> 
     <div style='width: 500px; height: 100px; overflow:auto'> 
     <table style='width: 1000px; background-color: #ff00ff;'> 
      <tr> 
       <td style='border: 3px solid black'><div style='position:relative;'>One</div></td> 
       <td><div style='position:relative;'>Two</div></td> 
      </tr> 
     </table> 
     </div> 
    </body> 
    </html>

任何想法？

來源

2010-03-11 CiscoIPPhone

任何人都已經能夠重現問題？ – CiscoIPPhone 2010-03-11 14:36:56

檢查我的答案。 – easwee 2010-03-11 15:40:23

這應該做的伎倆：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
     <title>IE Bug Demo</title> 
    </head> 
    <body> 
     <div style="width:500px;height:100px;overflow:auto;position:relative;"> 
     <table style="width: 1000px; background-color: #ff00ff;"> 
      <tr> 
       <td style="border:3px solid black;"><div style="position:relative;">One</div></td> 
       <td><div style="position:relative;">Two</div></td> 
      </tr> 
     </table> 
     </div> 
    </body> 
    </html>

來源

2010-03-11 15:37:35 easwee

嘗試移除位置：相對。請記住 - 不需要HTML，避免樣式定義。將它們保留在css

來源

2010-03-11 14:17:11 Artic

該示例已簡化。在真實的產品中，我將各種東西放置在單元內部，並且能夠將它們相對於單元放置很有幫助。 – CiscoIPPhone 2010-03-11 14:21:34

TABLE TD中的DIV不能很好地一起玩。我會不惜一切代價避免這種標記模式。在IE和其他處理衝突的方式上存在差異的很多，它只是成爲一個巨大的頭痛。

來源

2010-03-11 14:47:15 Robusto

他們究竟如何不一起？謹慎地闡述更多？ – easwee 2010-03-11 15:38:27

首先，如果任何東西在div上設置了px或％寬度，它可以使單元流動不足或溢出。即使沒有這一點，td中的div可能會導致意想不到的空白出現在div的上面或下面，這是無法解釋的......當所有其他人看起來不錯時，它可能只顯示在一列中。但它會拋棄你的佈局。他們有時工作嗎？當然。但是這種標記模式給我帶來了足夠的頭痛，我厭倦了調整，調整，調整，只是拋棄了整個事情。嚴重的是，它會給你買什麼？ – Robusto 2010-03-11 15:55:55

有問題的單元格是我的表格單元格。它們包含文本，不允許換行，但如果單元格不夠寬，無法包含所有文本，則可以將其切斷。除此之外，單元格還包含一個表格排序指示器和一個調整大小的句柄，用於更改單元格的大小。所有這些都是非常困難的，沒有div或跨度。使用easwees解決方案，它做我想要的，所以我會看看它是怎麼回事。 – CiscoIPPhone 2010-03-11 16:25:13

IE橫向滾動問題

回答

相關問題