質問編集履歴
4
文の修正
test
CHANGED
File without changes
|
test
CHANGED
@@ -4,9 +4,25 @@
|
|
4
4
|
|
5
5
|
|
6
6
|
|
7
|
-
|
7
|
+
下のpadding-bottomを 80px 0 にすると表示されますが、合っていますでしょうか。
|
8
|
+
|
8
|
-
|
9
|
+
他に変え方がありますでしょうか。
|
10
|
+
|
9
|
-
|
11
|
+
ご教授宜しくお願いいたします。
|
12
|
+
|
13
|
+
|
14
|
+
|
15
|
+
.work__content {
|
16
|
+
|
17
|
+
width: 420px;
|
18
|
+
|
19
|
+
padding-bottom: 80px;
|
20
|
+
|
21
|
+
text-align: left;
|
22
|
+
|
23
|
+
line-height: 1.8;
|
24
|
+
|
25
|
+
}
|
10
26
|
|
11
27
|
|
12
28
|
|
3
誤字修正。それに伴う画像の修正。
test
CHANGED
File without changes
|
test
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
例のように
|
1
|
+
例のように画像とそのテキスト表示したいです。
|
2
2
|
|
3
3
|
ご教授宜しくお願いいたします。
|
4
4
|
|
@@ -10,11 +10,7 @@
|
|
10
10
|
|
11
11
|
|
12
12
|
|
13
|
-
|
14
|
-
|
15
|
-
![画像
|
13
|
+
![修正したい画像](cba0a90a9321687f20e8ee80fd737803.png)
|
16
|
-
|
17
|
-
|
18
14
|
|
19
15
|
![例](c58b106f34c043fd0ce01691b4cbd33d.png)
|
20
16
|
|
@@ -196,7 +192,7 @@
|
|
196
192
|
|
197
193
|
.work__content:nth-of-type(4) {
|
198
194
|
|
199
|
-
or
|
195
|
+
order: 4;
|
200
196
|
|
201
197
|
}
|
202
198
|
|
2
画像を変えました
test
CHANGED
File without changes
|
test
CHANGED
@@ -16,7 +16,7 @@
|
|
16
16
|
|
17
17
|
|
18
18
|
|
19
|
-
![例](
|
19
|
+
![例](c58b106f34c043fd0ce01691b4cbd33d.png)
|
20
20
|
|
21
21
|
|
22
22
|
|
1
指摘を確認したところ</div>が抜けていましたので追記しました。style.cssの.work__contentsがhtmlになかったので追記しました。
test
CHANGED
File without changes
|
test
CHANGED
@@ -4,7 +4,15 @@
|
|
4
4
|
|
5
5
|
|
6
6
|
|
7
|
+
cssに画像一つずつをmargin-top margin-leftなどで試しましたがうまくいきませんでした。
|
8
|
+
|
9
|
+
cssに画像を一つずつ設定することは合っていますか?もし合っている場合はコードの書き方をご教授いただきたいです。
|
10
|
+
|
11
|
+
|
12
|
+
|
13
|
+
|
14
|
+
|
7
|
-
![
|
15
|
+
![画像の配置がずれている](46fcd496594a88288f7625c030294ed5.png)
|
8
16
|
|
9
17
|
|
10
18
|
|
@@ -16,18 +24,18 @@
|
|
16
24
|
|
17
25
|
<!--work-->
|
18
26
|
|
19
|
-
|
27
|
+
<section class="work">
|
20
|
-
|
28
|
+
|
21
|
-
|
29
|
+
<div class="u-content-wrapper">
|
22
30
|
|
23
31
|
<h2 class="u-heading">Work</h2>
|
24
32
|
|
25
|
-
<p class="u-text">オーダーメイドでのブーケ・アレンジメントのデザインのほか、<br>ウェディングやイベントの装花なども行なっています。<br>一人一人にあったご提案をさせていただきます。</p>
|
33
|
+
<p class="u-text">オーダーメイドでのブーケ・アレンジメントのデザインのほか、<br>ウェディングやイベントの装花なども行なっています。<br>一人一人にあったご提案をさせていただきます。</p>
|
26
|
-
|
27
|
-
|
28
34
|
|
29
35
|
<div class="work__contents__wrapper">
|
30
36
|
|
37
|
+
<div class="work__contents">
|
38
|
+
|
31
39
|
<div class="work__content">
|
32
40
|
|
33
41
|
<img class="work__content__image work__image__gift" src="Web 1280 – 1/work_gift.png" alt="白い花束の写真">
|
@@ -72,7 +80,11 @@
|
|
72
80
|
|
73
81
|
</div>
|
74
82
|
|
83
|
+
</div>
|
84
|
+
|
85
|
+
</div>
|
86
|
+
|
75
|
-
|
87
|
+
</section>
|
76
88
|
|
77
89
|
<!--/work-->
|
78
90
|
|
@@ -88,26 +100,6 @@
|
|
88
100
|
|
89
101
|
------------------------------------------------------*/
|
90
102
|
|
91
|
-
h3 {
|
92
|
-
|
93
|
-
display: block;
|
94
|
-
|
95
|
-
font-size: 1.17em;
|
96
|
-
|
97
|
-
margin-block-start: 1em;
|
98
|
-
|
99
|
-
margin-block-end: 1em;
|
100
|
-
|
101
|
-
margin-inline-start: 0px;
|
102
|
-
|
103
|
-
margin-inline-end: 0px;
|
104
|
-
|
105
|
-
font-weight: bold;
|
106
|
-
|
107
|
-
}
|
108
|
-
|
109
|
-
|
110
|
-
|
111
103
|
.work {
|
112
104
|
|
113
105
|
width: 100%;
|
@@ -118,6 +110,20 @@
|
|
118
110
|
|
119
111
|
|
120
112
|
|
113
|
+
.work__content {
|
114
|
+
|
115
|
+
width: 420px;
|
116
|
+
|
117
|
+
padding-bottom: 80px;
|
118
|
+
|
119
|
+
text-align: left;
|
120
|
+
|
121
|
+
line-height: 1.8;
|
122
|
+
|
123
|
+
}
|
124
|
+
|
125
|
+
|
126
|
+
|
121
127
|
.work__content__image {
|
122
128
|
|
123
129
|
width: 100%;
|
@@ -128,20 +134,6 @@
|
|
128
134
|
|
129
135
|
|
130
136
|
|
131
|
-
.work__content{
|
132
|
-
|
133
|
-
width: 420px;
|
134
|
-
|
135
|
-
padding-bottom: 80px;
|
136
|
-
|
137
|
-
text-align: left;
|
138
|
-
|
139
|
-
line-height: 1.8;
|
140
|
-
|
141
|
-
}
|
142
|
-
|
143
|
-
|
144
|
-
|
145
137
|
.work__content__text {
|
146
138
|
|
147
139
|
letter-spacing: 1.5px;
|
@@ -170,7 +162,45 @@
|
|
170
162
|
|
171
163
|
font-size: 24px;
|
172
164
|
|
165
|
+
|
166
|
+
|
173
|
-
}
|
167
|
+
}
|
168
|
+
|
169
|
+
|
170
|
+
|
171
|
+
.work__content:nth-of-type(1) {
|
172
|
+
|
173
|
+
order: 1;
|
174
|
+
|
175
|
+
}
|
176
|
+
|
177
|
+
|
178
|
+
|
179
|
+
.work__content:nth-of-type(2) {
|
180
|
+
|
181
|
+
order: 3;
|
182
|
+
|
183
|
+
margin-top: 120px;
|
184
|
+
|
185
|
+
}
|
186
|
+
|
187
|
+
|
188
|
+
|
189
|
+
.work__content:nth-of-type(3) {
|
190
|
+
|
191
|
+
order: 2;
|
192
|
+
|
193
|
+
}
|
194
|
+
|
195
|
+
|
196
|
+
|
197
|
+
.work__content:nth-of-type(4) {
|
198
|
+
|
199
|
+
orphans: 4;
|
200
|
+
|
201
|
+
}
|
202
|
+
|
203
|
+
|
174
204
|
|
175
205
|
|
176
206
|
|