質問編集履歴
2
情報修正
test
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Masonryの
|
|
1
|
+
Masonryを使って、スマホサイズの時に画像を縦2列に配置したい。
|
test
CHANGED
|
@@ -78,14 +78,24 @@
|
|
|
78
78
|
|
|
79
79
|
にならい、コードを書いてみたんですが、上手くこのサイトのように動きません。
|
|
80
80
|
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
81
|
+
参考サイトを試したんですが、画像がスマホの画面サイズ横幅いっぱいに縦に重なるだけで二列になってくれません、ブラウザを広げてもそのまま画像が画面いっぱいに広がるだけでした。
|
|
84
82
|
|
|
85
83
|
|
|
86
84
|
|
|
85
|
+
以下追記です。
|
|
86
|
+
|
|
87
|
-
|
|
87
|
+
画像がスマホの画面サイズ横幅いっぱいになるのは、他のページで書いていたcssがこの画像タグにも影響していたからでした。この部分は自己解決しました。
|
|
88
|
+
|
|
89
|
+
そして、回答にて指摘された画像サイズを小さくした所、きちんと動いてくれました。ありがとうございました。
|
|
88
90
|
|
|
89
91
|
|
|
90
92
|
|
|
91
|
-
|
|
93
|
+
ですが、問題としては画像サイズをそのまま使用したいので、画像サイズを変更しないともちろんのこと画像が広がるだけでフロート出来るスペースは出来ません。そこで、imgタグにwidth50%height:autoをかけてみたんですが、そうすると今度はきちんと動かなくなってしまいました。
|
|
94
|
+
|
|
95
|
+
|
|
96
|
+
|
|
97
|
+
画像サイズをそのままで、スマホの画面サイズで縦2列高さが違う要素を並べたい。という質問に変更したいんですが、こんな書き方で大丈夫でしょうか？
|
|
98
|
+
|
|
99
|
+
|
|
100
|
+
|
|
101
|
+
もし解決方法が分かる方、宜しくお願い致します。
|
1
質問内容の修正
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -78,8 +78,14 @@
|
|
|
78
78
|
|
|
79
79
|
にならい、コードを書いてみたんですが、上手くこのサイトのように動きません。
|
|
80
80
|
|
|
81
|
-
本家サイト
|
|
82
81
|
|
|
83
|
-
https://codepen.io/desandro/pen/vLeBLV?editors=0100
|
|
84
82
|
|
|
83
|
+
やりたい事はスマホの画面サイズの時に、縦2列に高さの違う要素を出来るだけ隙間なく並べたい。というものです。
|
|
84
|
+
|
|
85
|
+
|
|
86
|
+
|
|
87
|
+
しかし、参考サイトを試したんですが、画像がスマホの画面サイズ横幅いっぱいに縦に重なるだけで二列になってくれません、ブラウザを広げてもそのまま画像が画面いっぱいに広がるだけでした。
|
|
88
|
+
|
|
89
|
+
|
|
90
|
+
|
|
85
|
-
|
|
91
|
+
こちらのサイトはcssについては触れられていませんが、cssの記述なしでも動くって事を言っている記事で間違いないでしょうか？動かし方、コードの記入間違え、考えられる間違い、何かありましたらご享受下さい。宜しくお願い致します。
|