回答編集履歴

2

chousei

2021/10/21 00:59

投稿

yambejp
yambejp

スコア116849

test CHANGED
@@ -55,3 +55,69 @@
55
55
  ```
56
56
 
57
57
  あとは、どうしたいのか次第です
58
+
59
+ 下段落を下にずらすならこんな感じ?
60
+
61
+ ```HTML
62
+
63
+ <script>
64
+
65
+ window.addEventListener('DOMContentLoaded', ()=>{
66
+
67
+ document.querySelectorAll('div').forEach(x=>{
68
+
69
+ x.style.height=x.offsetHeight+"px";
70
+
71
+ });
72
+
73
+ });
74
+
75
+ </script>
76
+
77
+ <style>
78
+
79
+ body,html{
80
+
81
+ height:100%;
82
+
83
+ }
84
+
85
+ </style>
86
+
87
+ <div style="height:30%;">
88
+
89
+ <div style="height:25%;background:red;"></div>
90
+
91
+ <div id="d" style="height:30%;background:blue"></div>
92
+
93
+ <div style="height:25%;background:red"></div>
94
+
95
+ </div>
96
+
97
+ <div style="height:30%;">
98
+
99
+ <div style="height:25%;background:yellow;"></div>
100
+
101
+ <div style="height:30%;background:lime"></div>
102
+
103
+ <div style="height:25%;background:aqua"></div>
104
+
105
+ </div>
106
+
107
+ <input type="button" value="高さ変更" onclick="change()">
108
+
109
+ <script>
110
+
111
+ function change(){
112
+
113
+ d.innerHTML="aaa<br>aaa<br>aaa<br>aaa<br>aaa<br>aaa<br>aaa<br>aaa<br>aaa<br>aaa<br>";
114
+
115
+ d.style.height="auto";
116
+
117
+ d.parentNode.style.height="auto";
118
+
119
+ }
120
+
121
+ </script>
122
+
123
+ ```

1

調整

2021/10/21 00:58

投稿

yambejp
yambejp

スコア116849

test CHANGED
@@ -2,11 +2,9 @@
2
2
 
3
3
 
4
4
 
5
- 同じ色をつかっているからわかりにくいですが
5
+ 同じ色をつかっているからわかりにくいですがはみでてませんよ。
6
6
 
7
- はみでてませんよ。
7
+ relativeをしいしてあげるとわかりやすいかもしれません
8
-
9
-
10
8
 
11
9
  ```sciript
12
10
 
@@ -55,3 +53,5 @@
55
53
  </script>
56
54
 
57
55
  ```
56
+
57
+ あとは、どうしたいのか次第です