# レスポンシブ設定がうまくできない

**URL:** <https://www.nocode-faq.com/t/topic/2831>\
**Category:** レスポンシブ\
**Tags:** フロントエンド\
**Created:** [2022 年 4 月 26 日午前 10:23 UTC](https://www.nocode-faq.com/t/topic/2831 "2022-04-26T10:23:05Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Taiyo](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/taiyo/32/4508_2.png) [@Taiyo](https://www.nocode-faq.com/u/Taiyo)\
**Post date:** [2022 年 4 月 26 日午前 10:23 UTC](https://www.nocode-faq.com/t/topic/2831/1 "2022-04-26T10:23:05Z")

</div>

bubbleのレスポンシブについて質問です。  
ページ幅を700px以下にすると、スマホ幅用のデザインが表示されるように必要に応じてエレメントにconditionalを設定しました。

しかし、下記のように700pxいかにするといらない空白が出てきるようになってしまいました。通常、このような余白が出てくるときはエレメントの幅がfixedになってしまっているか、指定したpxサイズまでしか縮まらないようになっているという原因があると思うのですが全てのエレメントを見たところそのような設定はされていませんでした。

上記の原因以外で右側に余白が出てきてしまう原因をご存知でしたらご教授いただきたいです。

 ![スクリーンショット 2022-04-26 19.15.37](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/d/df533c7c1a07dd0d03fde1894864f6ad0460b24a.jpeg)

---

<div class="post-metadata">

**Author:** ![Aki\_Sydney](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/aki_sydney/32/6600_2.png) [@Aki\_Sydney](https://www.nocode-faq.com/u/Aki_Sydney)\
**Post date:** [2022 年 4 月 26 日午後 3:08 UTC](https://www.nocode-faq.com/t/topic/2831/2 "2022-04-26T15:08:36Z")

</div>

エディタを見てみないと何とも言えませんが、すべてのエレメントが正しく縮む設定になっているなら、もしかしたら何か非表示エレメントの「Collapse when hidden」にチェックが入っていないのかもしれません。  
あとは、新エディタであればStripe TokenやCSS Toolsなど、プレビューで見えないはずのプラグインも大きさとしてカウントされてしまいます。

するとたとえば、こんなことも起こり得ます。  
Apply a gap between elementsに24pxずつのgapが設定されていて、  
Stripe Tokenをwidth 1px, height1pxで置いているとします。  
このとき、最小値を意識して1pxに設定していたとしても、これがエレメント数にカウントされるので、  
24pxのgapが2つ取られ、48pxの空白 (+1px = 49px) が生まれます。

新エディタでは、このようなところにも意識しないといけないですね。

---

<div class="post-metadata">

**Author:** ![Taiyo](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/taiyo/32/4508_2.png) [@Taiyo](https://www.nocode-faq.com/u/Taiyo)\
**Post date:** [2022 年 4 月 27 日午前 7:38 UTC](https://www.nocode-faq.com/t/topic/2831/3 "2022-04-27T07:38:12Z")

</div>

あきさん！返信してくださりありがとうございます！

無事解決いたしました！ありがとうございました！
