# 特定のモニターでのみレイアウトが崩れてしまう

**URL:** <https://www.nocode-faq.com/t/topic/1972>\
**Category:** bubble\
**Tags:** フロントエンド\
**Created:** [2021 年 7 月 31 日午前 7:51 UTC](https://www.nocode-faq.com/t/topic/1972 "2021-07-31T07:51:35Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![tatsutatsuyan0529](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/tatsutatsuyan0529/32/2990_2.png) [@tatsutatsuyan0529](https://www.nocode-faq.com/u/tatsutatsuyan0529)\
**Post date:** [2021 年 7 月 31 日午前 7:51 UTC](https://www.nocode-faq.com/t/topic/1972/1 "2021-07-31T07:51:35Z")

</div>

お世話になります。  
質問させてください。

【困っていること】  
1枚目の添付した画像のようなレイアウトの画面があるのですが、特定のモニターでのみ2枚目の画像のようにボタンのレイアウトが崩れてしまう。

【実現したいこと】  
いずれのモニターで見ても通常通りのレイアウトになってほしい。  
MacBook13インチでは普通に見れるのですが、  
モニターはモニターは横が約51cm、縦が約32cmです。

【試したこと】  
レスポンシブはfixにしてあるため、開発環境でエレメントを置いた通りのレイアウトになるはずなのですが、なぜか対応できません。

もし、対応した経験がある場合は、その解決方法をご教示いただけますと幸いです。

よろしくお願いします。

 ![20210728.bubbleeditor](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/5/5f976e644e3c8116af713b6a67b72fe455233fbe.jpeg)  
 ![20210728.bubble崩れる](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/b/bbc4017b97ee50c8a512dcbc96aed4539bfa0258.jpeg)

---

<div class="post-metadata">

**Author:** ![jansnap](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/jansnap/32/6599_2.png) [@jansnap](https://www.nocode-faq.com/u/jansnap)\
**Post date:** [2021 年 8 月 1 日午前 1:06 UTC](https://www.nocode-faq.com/t/topic/1972/2 "2021-08-01T01:06:52Z")

</div>

画面の横幅を広くすると、ボタンが左寄せではなく真ん中寄りになってしまうのですね。  
3つあるボタンをグループで囲って、「結果へ戻る」ボタンを左寄せに指定するとどうなるでしょうか？  
Responsiveタブで見ながら調整するといいと思います。

 ![ScreenShot 2021-08-01 10.02.03](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/8/8520cc7e6e08fc559676dd013010b93256b50267.png)

---

<div class="post-metadata">

**Author:** ![tatsutatsuyan0529](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/tatsutatsuyan0529/32/2990_2.png) [@tatsutatsuyan0529](https://www.nocode-faq.com/u/tatsutatsuyan0529)\
**Post date:** [2021 年 8 月 1 日午前 1:31 UTC](https://www.nocode-faq.com/t/topic/1972/3 "2021-08-01T01:31:32Z")

</div>

jansnapさん

ご返信いただき、ありがとうございます。  
アドバイスいただいた件、試してみます！

ただ、こちら問題としては、ページのwidthをfixにしているにもかかわらず、  
特定のモニターで見たときにレイアウトが変わってしまうというところにあるのですが、  
このような経験はありますでしょうか？

---

<div class="post-metadata">

**Author:** ![jansnap](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/jansnap/32/6599_2.png) [@jansnap](https://www.nocode-faq.com/u/jansnap)\
**Post date:** [2021 年 8 月 3 日午前 12:36 UTC](https://www.nocode-faq.com/t/topic/1972/4 "2021-08-03T00:36:47Z")

</div>

残念ながら経験ないです💦

---

<div class="post-metadata">

**Author:** ![tatsutatsuyan0529](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/tatsutatsuyan0529/32/2990_2.png) [@tatsutatsuyan0529](https://www.nocode-faq.com/u/tatsutatsuyan0529)\
**Post date:** [2021 年 8 月 3 日午前 4:59 UTC](https://www.nocode-faq.com/t/topic/1972/5 "2021-08-03T04:59:51Z")

</div>

ご回答いただき、ありがとうございます🙇‍♂️
