種類のパラメータが、ここに行く:CSS - コンテンツの幅/高さを超えて拡張したときに絶対位置DIVの「自動拡張」を有効には、奇妙な例の
私は内容が挿入されたときに展開する絶対位置のDIVを取得するにはどうすればよいですその国境を越えて行く?ここでコードである:
<html>
<head>
<style>
* {margin: 0; padding: 0;}
body {white-space: nowrap; text-align: center; color: white; font-size: 2em;}
div#container {position: relative; height: 100px; width: 50px;}
div#a {height: 50px; width: 25px; background-color: red; position: absolute; top: 0; left: 0;}
div#b {height: 50px; width: 25px; background-color: blue; position: absolute; top: 0; right: 0}
div#c {height: 50px; width: 25px; background-color: orange; position: absolute; bottom: 0; left: 0;}
div#d {height: 50px; width: 25px; background-color: purple; position: absolute; bottom: 0; right: 0;}
span#title {position: relative; overflow: visible}
</style>
</head>
<body>
<div id="container">
<div id="a"><span id="title">This is my title</span></div>
<div id="b">B</div>
<div id="c">C</div>
<div id="d">D</div>
</div>
</body>
上記の例では、DIVにおけるコンテンツ「」(これは、幅/高さの制限に)隠されています。これを「min-height」と「min-width」に設定すると、コンテンツは他のdivの「背後」に置かれますが、移動することはありません。どうすればこれを達成できますか?
注:DIVがHTMLで注文される順序を「再配置」する必要があるため、これを理解しようとしています(Wordpressで子テンプレートを作成しようとしています)。どんな事例/リソースも大いに感謝しています。
乾杯、
Sapiensgladio
本当に物事を変更するdivの順序を変更する必要がある場合は、要素を並べ替えるためにjQueryソリューションを使用することをお勧めします。 – BumbleB2na