質問編集履歴

3

修正しました、

2018/12/29 04:19

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -48,10 +48,62 @@
48
48
 
49
49
  </ul>
50
50
 
51
+
52
+
51
53
  </div>
52
54
 
55
+ <div class="boxB-2">
56
+
57
+ <ul>
58
+
59
+ <li><a href="#">BOX2</a></li>
60
+
61
+ <li><a href="#">BOX2</a></li>
62
+
63
+ <li><a href="#">BOX2</a></li>
64
+
65
+ <li><a href="#">BOX2</a></li>
66
+
67
+ <li><a href="#">BOX2</a></li>
68
+
69
+ <li><a href="#">BOX2</a></li>
70
+
71
+ <li><a href="#">BOX2</a></li>
72
+
73
+ <li><a href="#">BOX2</a></li>
74
+
75
+ <li><a href="#">BOX2</a></li>
76
+
77
+ <li><a href="#">BOX2</a></li>
78
+
79
+ <li><a href="#">BOX2</a></li>
80
+
81
+ <li><a href="#">BOX2</a></li>
82
+
83
+ <li><a href="#">BOX2</a></li>
84
+
85
+
86
+
87
+ </ul>
88
+
89
+
90
+
53
91
  </div>
54
92
 
93
+ </div>
94
+
95
+
96
+
97
+ .boxB {
98
+
99
+ content: "";
100
+
101
+ clear: both;
102
+
103
+ display: block;
104
+
105
+ }
106
+
55
107
 
56
108
 
57
109
  .boxB-1 {
@@ -64,7 +116,15 @@
64
116
 
65
117
  }
66
118
 
67
-
119
+ .boxB-2{
120
+
121
+ float: left;
122
+
123
+ width: 20%;
124
+
125
+ background: yellow;
126
+
127
+ }
68
128
 
69
129
  .boxB-1 ul {
70
130
 
@@ -124,4 +184,30 @@
124
184
 
125
185
 
126
186
 
187
+ .boxB .pict {
188
+
189
+ width: 50%;
190
+
191
+ }
192
+
193
+
194
+
195
+ .boxB-2 ul {
196
+
197
+ list-style: none;
198
+
199
+
200
+
201
+
202
+
203
+ }
204
+
205
+
206
+
207
+ .boxB-2 li a {
208
+
209
+ text-decoration: none;
210
+
211
+ }
212
+
127
213
  ```

2

現状スクリーンショットの画像のようになっているのですが、この画像部分を親要素の大きさに合わせて横幅いっぱいに広げるにはどうすれば良いのでしょうか。

2018/12/29 04:19

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -1,10 +1,12 @@
1
- list内でaタグの下に、画像とテキストを入れて、その幅を画面の大きさに合わせて半分に設定したいのですが、画像が横いっぱいに広がりません。
1
+ ![![イメージ説明](7e0e48c325b753cd569cb5593739276f.jpeg)](5ed84c15a5cd41074b2ae9845513a876.jpeg)list内でaタグの下に、画像とテキストを入れて、その幅を画面の大きさに合わせて半分に設定したいのですが、画像が横いっぱいに広がりません。
2
2
 
3
3
  どのように設定したら良いのでしょうか。
4
4
 
5
5
 
6
6
 
7
7
  ```HTML
8
+
9
+ <div class="boxB">
8
10
 
9
11
  <div class="boxB-1">
10
12
 
@@ -46,7 +48,7 @@
46
48
 
47
49
  </ul>
48
50
 
49
-
51
+ </div>
50
52
 
51
53
  </div>
52
54
 

1

コードの変更をしました、

2018/12/29 03:47

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -4,9 +4,7 @@
4
4
 
5
5
 
6
6
 
7
-
7
+ ```HTML
8
-
9
-
10
8
 
11
9
  <div class="boxB-1">
12
10
 
@@ -51,8 +49,6 @@
51
49
 
52
50
 
53
51
  </div>
54
-
55
-
56
52
 
57
53
 
58
54
 
@@ -123,3 +119,7 @@
123
119
  max-height: 100%;
124
120
 
125
121
  }
122
+
123
+
124
+
125
+ ```