Contact Form7のデザインの乱れ

  • 24519

    (@24519-1)


    15年、 2ヶ月前

    初めまして。
    昨日、WordPressを設置しプラグインContact Form 7をインストールしました。

    Topicタイトル通りなのですが、、
    フォーム設定し試しに投稿ページより指定されたコードを貼りつけ
    プレビューで確認してみるとブラウザFirefox_3.6.13バージョンだと
    アドオンInFormEnterを導入しているせいかONの時は下の様な感じで
    名前と入力欄に大幅の開きが入って全体的にデザインが乱れてしまいます。
    なのですが他のサイトだとONにしているにも関わらず
    綺麗に整っていて全く乱れていません。
    この違いは何なんでしょうか？styles.cssにて設定可能でしょうか？
    詳しい方いましたらご教示ください。
    PC環境：Win7*pro64、通常ブラウザ火狐、予備ie8

    例）
    —————-
    名前/必須項目*
    ↓空白
    ↓空白
    ↓空白
    ■■■■（←入力フォーム）
    ////////////////////////////

    ※綺麗な方のサイト
    —————–
    名前 ■■■■

    ↑固定されていて乱れていません。
    ——————–

8件の返信を表示中 - 1 - 8件目 (全8件中)
  • モデレーター Takayuki Miyoshi

    (@takayukister)

    15年、 2ヶ月前

    実際にサイトを見てみないと正確なことはわかりませんが、使っているテーマのスタイルシートでそのようになるようなスタイルが指定されているためにそうなっていると思います。各サイトで使っているテーマの style.css を見比べてみてください。適用されているスタイルの状態確認には Firebug がおすすめです。

    トピック投稿者 24519

    (@24519-1)

    15年、 2ヶ月前

    やっぱりスタイルシートで固定？は可能なのですね～
    見ていたサイトですがwebクリエイターボックス（http://www.webcreatorbox.com/）
    さんです・・フォーム欄がすごく綺麗に整ってました。
    今もonにしてるのですが全く乱れていません。
    さっそくFirebug導入して模索してみます=3

    トピック投稿者 24519

    (@24519-1)

    15年、 2ヶ月前

    あれからチェックしながらにらめっこしてますが
    全くゴールに辿り着けないです・・
    サイト１
    サイト２
    サイト３
    １～３のサイトによればstyle=”margin:0px;”の記述で
    <form action=”送信先”>の箇所がわかればstyle=”margin:0px;”で解決できそうですが
    WordPressのプラグイン設定項目から[submit “送信” ]に
    半角スペースいれて記述してみましたが無反応でしたorz
    試しに<div style=”margin:0px;”>で挟んでみてもだめだったので
    Contact Form 7のstyle.cssを開きmargin:0px 0px 0px 0px;をいれてみてもだめでした。
    themesのstyle.cssでinput項目は項目と検索バーの箇所で上手く設定されてるのか
    プレビューでみるとレイアウトの崩れは起きてません。
    どこに指定してやれば空白は生まれずに済むのか
    分かるかたいましたら教えてください。

    kz

    (@kz)

    15年、 2ヶ月前

    こういう問題の場合は、他の人にとっては「実際にサイトを見てみないと正確なことはわかりません」ので、実際に問題の発生してる URL を教えていただく方が早く解決し易いです◎

    トピック投稿者 24519

    (@24519-1)

    15年、 2ヶ月前

    ありがとうございます。
    設置したばかりでテスト状態ですが
    アドレスはこちらになります。

    KKT

    (@kvex)

    15年、 2ヶ月前

    その肝心のコンタクトフォームを設置した固定ページはどこですかね？

    トピック投稿者 24519

    (@24519-1)

    15年、 2ヶ月前

    プレビューでチェックしていただけだったのですが公開しました。
    いかがでしょうか？URL

    KKT

    (@kvex)

    15年、 2ヶ月前

    えっと・・・・
    このソースなら、そうなってしまうでしょうね。

    コンタクトフォームの設定のほうで

    <p>名前*</p>
<p>[text* your-name 50] </p>

    とか、そんな風にしてるんじゃないですか？

    <p>お名前 (必須） [text* your-name 50] </p>
    のような感じにするだけじゃなくてですか？

8件の返信を表示中 - 1 - 8件目 (全8件中)

トピック「Contact Form7のデザインの乱れ」には新たに返信することはできません。