css - 非親要素からの CSS 位置

Question

親以外に基づいてdivを配置するために、変更できないコーディング制限があり、それを回避する方法を見つけようとしています。

変更できない次のコード構造があります。

<div class="row">
   <div class="sub-row01"></div>
   <div class="sub-row02"></div>
</div>
<div class="row">
   <div id="sub-row03"></div>
</div>

私がやろうとしているのは、.sub-row02 に対して #sub-row03 を配置することです。私が試したものはすべて、最初の .row に対して #sub-row03 を配置することしかできません

私が達成しようとしていることは可能ですか？もしそうなら、それをスタイリングする適切な方法は何ですか？

score 0 · Accepted Answer

あなたの質問に答えるには、親または先行する子を使用したスタイリングのみが許可されるため、純粋な css では不可能です。

例えば

a + b { } will style b
a ~ b { } will style b
a > be {} will style b

ただし、これらの場合にスタイルを設定する方法はありません。

ただし、これは JavaScript を介して行うことができます。このルートに行きたい場合は、次のようにすることができます。

document.getElementById("sub-row03").style.left = document.getElementById("sub-row02").offset().left;

テストしていないので、必要に応じてもう少し具体的なものを書くことができますが、基本的な概念には役立つはずです。

1 に答える 1