質問編集履歴
1
※追記※ ②の画面縮小した際のスクショを追加。
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -121,3 +121,49 @@
|
|
|
121
121
|
② padding 、 margin両方とも、ブラウザ表示した際、ブラウザ（chrome）の画面の幅を縮小すると、写真がズレてしまうのですが、この対策は何でしょうか？
|
|
122
122
|
|
|
123
123
|
Progateでのプレビューは縮小しても変わらないのですが...。
|
|
124
|
+
|
|
125
|
+
|
|
126
|
+
|
|
127
|
+
※追記※ ②の画面縮小した際のスクショを追加。
|
|
128
|
+
|
|
129
|
+
|
|
130
|
+
|
|
131
|
+
↑こんな感じでオレンジ色の画像ファイルが下に行ってしまう。
|
|
132
|
+
|
|
133
|
+
もちろん画面を最大にしていれば、
|
|
134
|
+
|
|
135
|
+
|
|
136
|
+
|
|
137
|
+
↑このようにちゃんと左詰めで表示されますが。
|
|
138
|
+
|
|
139
|
+
|
|
140
|
+
|
|
141
|
+
もしこれが『そう言う仕様』で、何か別なプロパティを指定すれば解決するのかも知れませんが、
|
|
142
|
+
|
|
143
|
+
何故こう思ったかと言うと、Progateで同じコードでプレビューした時は、画面縮小しても、「画像がズレない」からです。
|
|
144
|
+
|
|
145
|
+
Progateのスクショ↓
|
|
146
|
+
|
|
147
|
+
|
|
148
|
+
|
|
149
|
+
↑このように、画面を右から左へ縮小した際、オレンジの画像が下にズレないのです。
|
|
150
|
+
|
|
151
|
+
特別な固定するプロパティは見られません。
|
|
152
|
+
|
|
153
|
+
ちなみにその時の contents-item のCSS内での指定は、
|
|
154
|
+
|
|
155
|
+
```
|
|
156
|
+
|
|
157
|
+
.contents-item {
|
|
158
|
+
|
|
159
|
+
float: left;
|
|
160
|
+
|
|
161
|
+
margin-right:40px;
|
|
162
|
+
|
|
163
|
+
/*padding-right:40px;*/
|
|
164
|
+
|
|
165
|
+
/* margin-rightを40pxにしてください */
|
|
166
|
+
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
```
|