質問編集履歴
4
画像追加
test
CHANGED
File without changes
|
test
CHANGED
@@ -244,6 +244,14 @@
|
|
244
244
|
|
245
245
|
|
246
246
|
|
247
|
+
ブラウザを広げるとサイズによっては下記のような感じになるので、#photos、#photos2のmarginを合わせられたらと思っております。
|
248
|
+
|
249
|
+
|
250
|
+
|
251
|
+
![イメージ説明](dd78325dbe33f35874379fa916edf82b.gif)
|
252
|
+
|
253
|
+
|
254
|
+
|
247
255
|
どの様にコードをかけば、きちんと#photosの幅を取得して、#photos2に取得することができるのでしょうか?
|
248
256
|
|
249
257
|
|
3
追加の問題を追記しました。
test
CHANGED
File without changes
|
test
CHANGED
@@ -202,6 +202,58 @@
|
|
202
202
|
|
203
203
|
|
204
204
|
|
205
|
+
###追加の問題
|
206
|
+
|
207
|
+
|
208
|
+
|
209
|
+
kei344様からご回答いただいた通り、masonry を複数使うことで
|
210
|
+
|
211
|
+
1カラムの部分がきれいに100%になる様になりました!
|
212
|
+
|
213
|
+
|
214
|
+
|
215
|
+
が、私自身も認識の誤りがあったのですが、1カラムの部分は、下のカラムと
|
216
|
+
|
217
|
+
幅を合わせたいです。
|
218
|
+
|
219
|
+
|
220
|
+
|
221
|
+
jquery,javascriptの知識がないに等しいのですが、
|
222
|
+
|
223
|
+
下記で簡単に取得できそうなものなのですが、うまくいきません。
|
224
|
+
|
225
|
+
|
226
|
+
|
227
|
+
<#photos→ 複数カラムのwrap、#photos2→ 1カラムのwrapです。>
|
228
|
+
|
229
|
+
|
230
|
+
|
231
|
+
```
|
232
|
+
|
233
|
+
$(function(){
|
234
|
+
|
235
|
+
var w=$("#photos").width();
|
236
|
+
|
237
|
+
$("#photos2").width(w);
|
238
|
+
|
239
|
+
});
|
240
|
+
|
241
|
+
|
242
|
+
|
243
|
+
```
|
244
|
+
|
245
|
+
|
246
|
+
|
247
|
+
どの様にコードをかけば、きちんと#photosの幅を取得して、#photos2に取得することができるのでしょうか?
|
248
|
+
|
249
|
+
|
250
|
+
|
251
|
+
|
252
|
+
|
253
|
+
|
254
|
+
|
255
|
+
|
256
|
+
|
205
257
|
teratailを使い始めて間もないので、
|
206
258
|
|
207
259
|
エンジニアの方たちに不快な思いをさせてしまうかもしれません。
|
2
現状を修正しました
test
CHANGED
File without changes
|
test
CHANGED
@@ -26,9 +26,13 @@
|
|
26
26
|
|
27
27
|
・1カラムの部分の左右の余白が正しく設定されない。
|
28
28
|
|
29
|
-
・ロードした時は良いが、画面の幅を縮め
|
29
|
+
・ロードした時は良いが、画面の幅を縮めると、1カラムの下の余白が200px近く開き、
|
30
|
-
|
30
|
+
|
31
|
-
無視されて、1カラムの下の行が重なって表示される。
|
31
|
+
画面幅を元に戻してみると、1カラムの部分の高さが無視されて、1カラムの下の行が重なって表示される。
|
32
|
+
|
33
|
+
|
34
|
+
|
35
|
+
すべては1カラムの部分がなければ正常に動くのですが、1カラムの部分を入れたいがために苦労をしています。。。
|
32
36
|
|
33
37
|
|
34
38
|
|
1
現状を追加しました
test
CHANGED
File without changes
|
test
CHANGED
@@ -18,6 +18,20 @@
|
|
18
18
|
|
19
19
|
|
20
20
|
|
21
|
+
###現状
|
22
|
+
|
23
|
+
|
24
|
+
|
25
|
+
・1カラムの部分を除いては正しく動いている。
|
26
|
+
|
27
|
+
・1カラムの部分の左右の余白が正しく設定されない。
|
28
|
+
|
29
|
+
・ロードした時は良いが、画面の幅を縮めてみたりすると、1カラムの部分の高さが
|
30
|
+
|
31
|
+
無視されて、1カラムの下の行が重なって表示される。
|
32
|
+
|
33
|
+
|
34
|
+
|
21
35
|
###該当のソースコード
|
22
36
|
|
23
37
|
ざっくりと必要と思われる部分を抜粋します。
|