【问题标题】:Overflow-x/y not working in IE溢出-x/y 在 IE 中不起作用
【发布时间】:2014-04-16 10:48:49
【问题描述】:

当前 IE 版本:11 网址:www.4pia.com/beta

现在我已经尝试使用 Firefox、Chrome 和 IE11 测试该网站。 Chrome 和 Firefox 都可以使用 overflow CSS。但是,IE11 没有。当我尝试更改 CSS 代码中的宽度/高度时,它根本不会影响 IE 的渲染(所以我认为这就是我的问题所在)。我不确定我需要在哪里转移到溢出代码才能使其工作。

CSS:

#repnews{
    float: right;
    width: 450px;
    height: 600px;
}

#reptable tbody{ 
    width: 450px;
    height: 600px;
    display: block;
    overflow-y: scroll;
    overflow-x: hidden;
    color: #000; 
    font-size: 11px; 
    font-weight: bold;
}

#reptable tr{
    max-width: 450px;
    height: auto;
    display: block;
}

#reptable td{
    max-width: 360px;
    height: auto;
    display: block;
}

HTML/PHP

<?php
echo "<div id='repnews'>";
echo "<div class='counter' align='right'>".$reptotal."<img src='images/rep.png'></div>";
echo "<hr class='repborder'>";
echo "<table id='reptable'>";

echo "<tr><td><div class='icon'><a href='/beta/bio?code=".$code."'>".$Name."</a> - ".$Tim;
echo "<img src='images/reply.png' class='tooltip' title='Please sign into Twitter to reply'>";
echo "<img src='images/retweet.png' class='tooltip' title='Please sign into Twitter or Facebook retweet'>";
echo "<img src='images/check.png' class='tooltip' title='Please sign in to vote'>";
echo "<img src='images/veto.png' class='tooltip' title='Please sign in to vote'>";
echo "</div></td></tr>";
echo "<tr><td nowrap='wrap' width='360px'>".$Tweet."</td>";
echo "<td width='90px'><font color='green'>".$fol."<br>Followers</font></td></tr>";

echo "</table>";
echo "</div>";
?>

【问题讨论】:

  • 与其强制表格具有display: block,这可能会导致表格布局出现问题(默认为display: table),为什么不将每个表格包装在&lt;div&gt; 中,给它一个高度并在那里设置溢出?或者甚至更好地使用 &lt;divs&gt; 进行布局而不是表格,因为这不是表格数据。
  • 这实际上也更干净。我会试试谢谢!

标签: php html css internet-explorer


【解决方案1】:

确保您没有对overflow-x 或overflow-y 使用visible 以及对另一个使用可见以外的其他东西。可见值被解释为 auto。

http://www.brunildo.org/test/Overflowxy2.html

这可以帮助CSS overflow-x: visible; and overflow-y: hidden; causing scrollbar issue

【讨论】:

  • EDIT x2:我已经调查了这个问题,但它似乎仍然可以做到 overflow: visible 尽管告诉它是 overflow-x:hidden 和 overflow-y: scroll。我的代码中没有其他 overflow CSS,所以我认为它不会从其他任何地方继承它。
猜你喜欢
  • 2018-02-04
  • 1970-01-01
  • 2018-08-03
  • 2014-08-10
  • 1970-01-01
  • 1970-01-01
  • 2016-09-16
  • 1970-01-01
  • 2012-02-14
相关资源
最近更新 更多