# HubSpotフォームのスタイル設定について **URL:** \ **Category:** Tips, Tricks & Best Practices\ **Tags:** enterprise\ **Created:** [February 6, 2021, 7:29am UTC](https://community.hubspot.com/t/hubspot/31389 "2021-02-06T07:29:39Z")\ **Posts on this page:** 4\ **Page:** 1
**Author:** ![Motoya](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/motoya/32/76463_2.png) [@Motoya](https://community.hubspot.com/u/Motoya)\ **Post date:** [February 6, 2021, 7:29am UTC](https://community.hubspot.com/t/hubspot/31389/1 "2021-02-06T07:29:39Z")
HubSpotフォームを利用して下記のことを実装しようと検討しております。 ・コンタクトプロパティのフォーム項目の挿入(電話番号や氏名など) ・フォーム送信時の注意点(利用規約に関しての確認)を記載したリッチテキストフィールドを挿入 上記2点でスタイルのことで困っていることがあります。 1:プロパティの入力フィールドの大きさをフォームエディターで変更はできないか？ 例えば「電話番号」と「住所」では入力数と長さがまったく異なりますが、 デフォルトではフォームのフィールドの幅いっぱいに両方ともなります。 プロパティごとに入力フィールドの大きさを変更できればイメージ通り 2:リッチテキストは最大のフィールドサイズを決めて、最大の大きさよりも超えた範囲は スクロールで見れるような仕様にはできないか？ 例えば利用規約などは別ページに遷移させるよりも、確認と確認をしたことのチェックを 1ページに完結させたいため、スクロールで閲覧ができるようにしたいです。 ---
**Author:** ![marykashima](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/marykashima/32/13515_2.png) [@marykashima](https://community.hubspot.com/u/marykashima)\ **Post date:** [February 8, 2021, 1:20am UTC](https://community.hubspot.com/t/hubspot/31389/2 "2021-02-08T01:20:52Z")
@Motoya さんこんにちは。 HubSpotフォームは1、2ともCSSで装飾する場合がほとんどです。 もちろん、HubSpotフォームのスタイルもある程度は使えますが、条件によります。 フォームはどちらのページで利用されますか？ A HubSpot CMSページ B 外部ページ Aの場合 HubSpotフォームのスタイルは適用されませんのでCMS内のCSSで指定する必要があります。 Bの場合 1、2どちらもHubSpotフォームのスタイルでは適用されていないものです。 フォーム内設定「未加工のHTMLフォームとして設定」にチェックをいれて外部CSSで指定する必要があります。 なお、1に関してはフォームを作成する画面で「2カラム」「3カラム」にする方法はありますので、 それを使い、擬似的に長さを指定することはできます。 （あまりおすすめしません） やり方は、わざと2カラムにして、右側の適当な単行テキストを非表示要素にすることです。 ![37611iAEF72135EDBEF033.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/f/d/fda0f21e3d6dea07084df899c93bb23ca82b84b1.png) 参考になれば幸いです。 ---
**Author:** ![Motoya](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/motoya/32/76463_2.png) [@Motoya](https://community.hubspot.com/u/Motoya)\ **Post date:** [February 8, 2021, 6:49am UTC](https://community.hubspot.com/t/hubspot/31389/3 "2021-02-08T06:49:39Z")
@marykashima 様 ありがとうございます！ AのHubSpotCMSページに埋め込みで検討しております。 CSSで修飾して回避する手段を選択するようにいたします。 頂いた2カラムで修正する方法は目からうろこでした。。 PC版では問題ありませんが、スマフォのことを考えた挙動を設計すると CSSで設計したほうが確実そうなのでそうしてみます！ ありがとうございました！ ---
**Author:** ![marykashima](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/marykashima/32/13515_2.png) [@marykashima](https://community.hubspot.com/u/marykashima)\ **Post date:** [February 8, 2021, 6:55am UTC](https://community.hubspot.com/t/hubspot/31389/4 "2021-02-08T06:55:53Z")
@Motoya よかったです。レスポンシブ大事ですしね。 なお、ABと書いておきながら逆の方針を記載していました。最初の投稿は編集済みです。