フォームのずれについて | Community
Skip to main content
October 18, 2017
Solved

フォームのずれについて

  • October 18, 2017
  • 1 reply
  • 236 views

ネクストエナジーの髙山と申します。

マルケトを導入し、初めてランディングページを作成しているのですが、

フォーム内で項目が中央に寄せられず困っております。

以下を試してみましたが、解決せず

・margin 0 auto

・display: incline-block + text-align:center

・position: absolute

フォーム:〈div class="mktoForm" id="from"〉

上記フォームを内包する親要素:〈div id="mktContent" class="mktEditable"〉

うまくセンター寄せる方法をご存じの方がいらっしゃいましたら、

ご教示いただけませんでしょうか。

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Taishi_Yamada

髙山 龍彦さん、こんにちは

フォームの中身ですよね?

たとえば、↓でいうところの、「メールアドレス:」の部分を真ん中にしたいとうことですか?

(何か、そうではない気がしてますが。。。。)

こんな感じに。。。。というのと簡単に描いてもらえると、もう少し具体的な事が言えるかもしれません。

ちなみに、ここの投稿欄は、コピー&ペーストで図が簡単に貼り付けられます。

といいながら、フォームのCSSを完璧にやりきろうとすると時間ばかりが掛かりすぎるので、私は適度に割り切ってますけどね(諦めが早いw。マルケトは妥協も大事。パフォーマンスに影響が些細だと思ったら諦めるw)

-Yamada

1 reply

Taishi_Yamada
Taishi_YamadaAccepted solution
Community Manager
October 19, 2017

髙山 龍彦さん、こんにちは

フォームの中身ですよね?

たとえば、↓でいうところの、「メールアドレス:」の部分を真ん中にしたいとうことですか?

(何か、そうではない気がしてますが。。。。)

こんな感じに。。。。というのと簡単に描いてもらえると、もう少し具体的な事が言えるかもしれません。

ちなみに、ここの投稿欄は、コピー&ペーストで図が簡単に貼り付けられます。

といいながら、フォームのCSSを完璧にやりきろうとすると時間ばかりが掛かりすぎるので、私は適度に割り切ってますけどね(諦めが早いw。マルケトは妥協も大事。パフォーマンスに影響が些細だと思ったら諦めるw)

-Yamada

November 2, 2017

山田様

ご返答いただき有難うございました。

送信ボタンや入力フィールドがデバイスによって表示が違うので悩んでいました。

最終的に下記のように編集フィールドいっぱいに設定をすることで対応いたしました。

うまい妥協点を見つけていきたいと思います。

有難うございました。

Taishi_Yamada
Community Manager
November 2, 2017

レスポンシブ(デバイス違い対応)のために、Form部分の幅を決めず(制限かけず)にレイアウトするの事はしてますね。

MarketoのLPでも使いますが、たとえばForm部分をiframeなどで別のWebページに埋め込むときなども同様のテクニックを使ってます。

細かい所では完璧に成りきらない部分も正直あるのですが、最後はまぁまぁで妥協してますけどね。。。

そのうち何かうまい策が見いだせたら、共有頂けるとみなさん助かると思います