0

ヘッダー要素の背景 css タグを使用して、Web ページの上部にバナーを配置しています。

HTML:

<section class="page-wrapper">
    <header class="block"></header>
    <div class="container"></div>
    <footer></footer>
</section>

CSS:

.page-wrapper > header {
  background: url('/path/to/image.jpg') no-repeat;
  background-size: cover;
  width: 100%;
  height: 450px;
}

スティッキー フッターに使用される別の CSS ルール。関連するかどうかはわかりませんが、念のためここに追加します。

.block {
  display: table-row;
}

これは、Chrome と Firefox で問題なく動作します。ただし、Internet Explorer 11 および 10 では、レンダリングに失敗することがあります。しかし、カーソルをメニュー項目の上に置くと、その要素の下でのみレンダリングされます。「ときどき」とは、F5 キーを 30 回連打できることを意味し、レンダリングされる場合とレンダリングされない場合があります。私にはランダムに見えます。

キャッシュの問題を除外するために、画像の名前を変更しようとしました。

IE 11 と 10 の両方で 3 台の別々のコンピューターで試しました。

埋め込まれたスクリーンショットを投稿できないようです。少なくとも 10 の評判が必要です。代わりにimgurにリンクします。

ワーキング: http://imgur.com/COhiKgx

問題: http://imgur.com/PMjfzUx

誰もがこのようなことを経験しましたか?

編集: コメントにライブ サイトの URL を追加しました。元の投稿にこれ以上リンクを追加できません。

4

1 に答える 1