私は現在、代替コンテンツが応答可能であるが、画像が各セクションのテキストの上に残っている必要があるページを開発しています。したがって、たとえば、こちらのページのレイアウトがどのように見えるかのモックアップされています、このページはモバイルデバイス上でどのように見えるか応答列にレスポンシブルタイルコンテンツの問題。テキストの上に常に画像を表示するには？
されています：
として、第2、第4、第6セクションなどのテキストの下に画像が表示されていることがわかります。
サイズを小さくすると、各セクションの画像は、各セクションのテキストの前に常に表示されます。私たちはいろいろな方法を試してきましたが、これを動作させるようなことはありません。
どのようなCSSの例とヘルプが大いに感謝されるでしょう。
ご提供いただいた情報に基づいて、小さい画面を使用しない場合は、行が奇数か偶数かによって、float: leftとfloat: rightのプロパティを使用する簡単な解決策を次に示します。ここでの主なCSSコードです：
@media (min-width: 600px) {
div {
width: 50%;
}
li:nth-child(2n) > div.image {
float: left;
}
li:nth-child(2n + 1) > div.image {
float: right;
}
li:nth-child(2n) > div.text {
float: right;
}
li:nth-child(2n + 1) > div.text {
float: left;
}
}
そして、ここで完全なサンプルコードです： https://jsfiddle.net/zxba9mw3/
あなたが試したもののいくつかの例を掲載場合には役立つだろう。 – sol
ようこそスタックオーバーフロー！コードヘルプを求める質問には、質問自体に** ** [** Stack Snippet **]（https://blog.stackoverflow.com/2014/09/introducing-runnable）で**それを再現するのに必要な最短コードを含める必要があります** -javascript-css-and-html-code-snippets /）。 [**最小限で完全で検証可能なサンプルの作成方法**]（http://stackoverflow.com/help/mcve）を参照してください。 –