<a class="button contact-btn" href="https://r-management.jp/security/forum20210715/contact/">お申し込みはこちら</a> <!--申し込み--> <div class="mx-auto px-4 py-4 container contact-content"> <h4 class="text-center">無料フォーラム・LIVE配信に申し込む</h4> <div class="contact-boxes row" style="background:#EFEFEF;"> <div class="contact-box text-center col-md-6" style="background:#EFEFEF; align-items: center;"> <p><span class="blue-paragraph">お電話でもお気軽にお問い合わせください</span><br> <span class="phone"><strong><i class="fas fa-phone" style="color:lightskyblue;"></i> 090-9100-0793</strong></span><br> (平日10:00〜18:00)</p> <p class="contact-info">担当:高久(タカク)</p> </div> <div class="col-md-6 text-center contact-box" style="background:#fff; "> <p class="blue-paragraph">申込やメールでのお問い合わせはこちら</p> <a href="https://r-management.jp/security/forum20210715/contact/" class="contact-red-btn">申し込む</a> <p class="contact-info">メールアドレス:info@r-management.jp</p> </div> </div> <p class="text-center" style="padding:10px;"><span style="background:#333; color:#fff; padding:5px;">開催日</span> 2021年7月15日木曜 9:20~17:20</p> </div> <!-- <p class="contact-p"><br>オンライン配信のみ</p> --> </div> コード ```![イメージ説明](9d510c2f346d4f831af1baeb89d0f742.png)### 前提・実現したいこと スマホのレスポンシブ対応して、綺麗にしたい ### 発生している問題・エラーメッセージ https://r-management.jp/security/forum20210715/ https://r-management.jp/work_style_reform/forum20210713/ これらのサイトの「無料フォーラム・LIVE配信に申し込む」の部分が、PCの開発ツールでは問題なく表示されるのですが、実際にスマホの横画面にすると謎の空白が出来てしまいます。 ### 試したこと 検証ツール左上のレスポンシブ確認のにあるスマホの種類すべて試しましたが 問題はありませんでした。しかし、実際に自分のスマホでは崩れているため、どこに問題があるかわからず、いろいろ検索してみましたが、解決しませんでした。クライアントに https://r-management.jp/security/forum20210408/ これなら崩れいないからそれを参考にしろといわれましたが、違いが分かりません
とりあえずその崩れている画像と、ソースコードを提示してください。
貴方の環境を横で見ている訳じゃないので、質問文に書いてある以上のことは
他のユーザーには分かりません。
PCであっても、ブラウザの機能でレスポンシブデザインを確認するツールがありますが、それでは再現しないのですか?
検証ツールに左上のボタンなら試しました。
その試した内容を、質問文中に追記してください。スマホっていろんな画面幅があるので、試した範囲が足りていない可能性もありますし。
この画像を拝見すると、電話番号とかが書いてある部分の要素が明らかにはみ出してますよね?
つまりこの要素のwidthが外枠に比べてデカいサイズ指定されてるんだと思いますが、直接htmlタグにstyleを書かれてるものが多いですが、CSSは使われていないのですか?
元になったサイトの文言を変えたり、色を変えたりしただけなので、CSSはそのまま使用しています。
ちなみに元のサイトも崩れていました。
回答2件
あなたの回答
tips
プレビュー