Q&A
今現在どういうCSSのスタイルが当たっているか、もしくはCSSを適用していないかを追記してください。
それによって回答が変わってきます
１列目・２列目共に160x160の画像を２枚ずつ並べているのですが、縦がずれてしまいます。
（HTMLのみ利用可能なサイトとなります。そしてスマホ用画面となります）
解決策がありましたらご教授お願いできませんでしょうか。
回答2件
0
自己解決
<<別にipohone8で２列に表示させるコードがどこかにあってそれが悪さしているのでは？
なるほどな、と思いました
<<コード１行目を
<div align="center" style="margin: 0;padding: 0;"> と、書き換えてstyle=が使えるのか、使えたとして結果がどう変わるか試してみてはどうでしょうか？ imgタグにもstyle="margin: 0;padding: 0;"を付けてみて結果がどうなるか知りたいです。どちらも試した所、私の画面では特に変わらずでした。
このままでいこうと思います。
お二人様、迅速な回答誠にありがとうございました。
投稿2020/05/19 03:09
総合スコア0
0
私の環境では問題なく表示されました。
環境：Win10,ローカル,GoogleChrome最新版
html
1 2 <div align="center"> 3<a href="https://store.shopping.yahoo.co.jp/ichimangoku/71659.html"> 4<img src=https://shopping.c.yimg.jp/lib/ichimangoku/rs7nh62fkhepmv81589783286_1589783800.jpg width=160></a> 5<a href="https://store.shopping.yahoo.co.jp/ichimangoku/428236.html"> 6<img src=https://shopping.c.yimg.jp/lib/ichimangoku/3b6vhxg8hpxlyfh1589782822.jpg width=160></a> 7<br> 8<a href="https://store.shopping.yahoo.co.jp/ichimangoku/709108.html"> 9<img src=https://shopping.c.yimg.jp/lib/ichimangoku/2zbxb17yvi85fif1589795736.jpg width=160></a> 10<a href="https://store.shopping.yahoo.co.jp/ichimangoku/a940.html"> 11<img src=https://shopping.c.yimg.jp/lib/ichimangoku/842xd1jjj53xvm91589794213.jpg width=160></a> 12</div>
投稿2020/05/19 00:11
総合スコア124
当方も問題なく表示されました。「杏のおかげ」については、追記依頼にも書いたように左右に白い余白つきの画像なので白い余白がそろって表示されてました。
お二人様、回答ありがとうございます。
画像で２列目「PREO」も１列目一枚目と比較して数ｍｍずれてしまっていると思うのですが、お二人様回答の通り他環境でずれなく見れるのであれば、記載したHTMLとしては特に問題はなさそうという事でしょうか？（私の画像はiPhone８でサイトTOPにアクセスしたものです）
Chrome,FireFox,Edge,IE全てで確認しましたが問題ないようです
ちなみに、FireFoxのレスポンシブデザインモードでipone6/7/8を選んでみましたが、画像が小さくなって
４つ横に並びました。
レスポンシブモードではない状態でブラウザの横幅を縮めていくと２列になりました。表示は正常です。
以上のことから考えて、別にipohone8で２列に表示させるコードがどこかにあってそれが悪さしているのでは？
可能ならばですが、コード１行目を
<div align="center" style="margin: 0;padding: 0;">
と、書き換えてstyle=が使えるのか、使えたとして結果がどう変わるか試してみてはどうでしょうか？
imgタグにもstyle="margin: 0;padding: 0;"を付けてみて結果がどうなるか知りたいです。
あなたの回答
tips
プレビュー
