質問編集履歴

4

画像追加

2016/09/08 13:19

投稿

hananoko_runrun
hananoko_runrun

スコア21

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

追加の問題を追記しました。

2016/09/08 13:19

投稿

hananoko_runrun
hananoko_runrun

スコア21

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

現状を修正しました

2016/09/08 02:52

投稿

hananoko_runrun
hananoko_runrun

スコア21

test CHANGED
File without changes
test CHANGED
@@ -26,9 +26,13 @@
26
26
 
27
27
  ・1カラムの部分の左右の余白が正しく設定されない。
28
28
 
29
- ・ロードした時は良いが、画面の幅を縮めてみたりすると、1カラムの部分高さ
29
+ ・ロードした時は良いが、画面の幅を縮めると、1カラムの余白200px近く開き、
30
-
30
+
31
- 無視されて、1カラムの下の行が重なって表示される。
31
+ 画面幅を元に戻してみると、1カラムの部分の高さが無視されて、1カラムの下の行が重なって表示される。
32
+
33
+
34
+
35
+ すべては1カラムの部分がなければ正常に動くのですが、1カラムの部分を入れたいがために苦労をしています。。。
32
36
 
33
37
 
34
38
 

1

現状を追加しました

2016/09/07 15:48

投稿

hananoko_runrun
hananoko_runrun

スコア21

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
  ざっくりと必要と思われる部分を抜粋します。