0

HTML5ボイラープレートを使用しており、IE用のMicrosoftフィルターを含むグラデーションの背景を追加しました。IE8では、コンテンツがビューポートよりも水平方向に大きい場合（垂直方向に正常に機能）、スクロールバーが表示されますが、非アクティブであり、ビューポートを超えるコンテンツにはアクセスできません。

（簡略化された）HTML：

<!doctype html>
<head>
  <meta charset="utf-8">
  <title>Gradient/Horizontal Scrollbar IE8 ~ HTML5 BoilerPlate test</title>
  <link rel="stylesheet" href="test.css">
</head> 
<body>
  <div id="topbar">
    This is a line of text to test the horizontal scrollbar when used with MS filter gradient background.
  </div>
</body>
</html>

CSS：

body {
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#3c3c3c');
  background: #3c3c3c -webkit-gradient(linear, left top, left bottom,
    from(#ffffff), to(#3c3c3c) ) no-repeat; /* for webkit browsers */
  background: #3c3c3c -moz-linear-gradient(top, #ffffff, #3c3c3c) no-repeat; /* for FireFox 3.6+ */
}
#topbar {
    width: 692px;
    height: 80px;
    background-color: #ccc;
}
4

1 に答える 1

0

H5BPがなくても再現できました。http://jsfiddle.net/nimbu/rnqsW/show/

私の推奨事項は、フィルターを使用せず、サポートされていないブラウザーには単色を使用することです。また、OperaとIE10 +の両方がそれらをサポートしているため、グラデーションに-o-と-ms-を追加する必要があります。

于 2011-06-30T19:30:58.817 に答える