css - モバイル デバイス上のテキストを覆う画像

Question

このサイトをモバイル デバイスで動作させようとしています: http://whitehallrow.com/

モバイル用の青いリボンと対応する写真がうまく表示されていなかったため、削除することにしました。そこで、モバイル向けに 2 つの要素を組み合わせた新しい画像を作成しました。しかし、Blackberry でページを表示すると、ページ上のテキストの大部分が写真で覆われています。どうすればこれを修正できますか?

Answer 1

CSS @media のみを調べることを検討します。

例：

通常画面：

#div {
   properties for normal screen;
}

モバイル

@media only screen and (max-width: 400px) {
  #div {
  properties for mobile device here;
  }
}

詳細については、こちらをご覧ください: @media only screen