FC2ブログのテンプレート工房

カスタマイズが簡単な共有テンプレートを配布しています。テンプレートをカスタマイズして自分だけのオリジナルブログを作りませんか?

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
[ --/--/-- --:-- ] スポンサー広告 | TB(-) | CM(-)

プラグイン内にある入力欄の幅を設定する

公式プラグイン「メールフォーム」は、そのHTML内で入力欄の幅が90%と設定されています。
しかし公式プラグイン「検索フォーム」の入力欄等は幅が設定されていません。

これら入力欄の幅が設定されていない公式、共有プラグインを実装したときに、IEでは収まっているのにFirefoxでは枠から飛び出している等、ブラウザにより違う幅が表示されてしまいます。

この問題を解決するためには、プラグインを囲っているクラスのinput,textareaに対して、スタイルシートで幅を設定します。

当サイト配布のテンプレートであれば、以下をスタイルシートの末尾に加えてください。

standardシリーズの場合】

.left_outline input[type="text"],
.right_outline input[type="text"],
.left_outline textarea,
.right_outline textarea {
width: 90%;
}



lightframeシリーズの場合】

.plugin1_body input[type="text"],
.plugin2_body input[type="text"],
.plugin1_body textarea,
.plugin2_body textarea {
width: 90%;
}



幅の数値はお好みに合わせて設定してください。

ただしIE6以下は属性セレクタに対応していないため、上記スタイルシートが効きませんのでご了承ください。

【2009/09/06 追記】この記事の修正はlightframeシリーズのver.05以降、standardシリーズのver.10以降には実装済みです。各バージョン情報はHTMLかCSSの最下部に記されています。

関連記事
[ 5724 ] えへ
こんばんは♪ 自分の定義ですと以前、ご指導していただいた内容が優先されている感じです。ただ、いたおさんのサイトがLinuxで普通に見れることから、「プラグイン内にある入力欄の幅を設定する」が効いているのかな?と思っております☆
微妙ですけど、トラバ発射します。
[ 2009/08/29 20:48 ] [ 編集 ]
[ 5726 ] > カンクネンさん
Linuxでも普通に見れるということで安心しました。
トラバありがとうございます^^
[ 2009/08/29 22:06 ] [ 編集 ]
[ 8719 ] 承認待ちコメント
このコメントは管理者の承認待ちです
[ 2010/07/15 09:16 ] [ 編集 ]
コメントの投稿









管理者にだけ表示
※現在カスタマイズに関するサポートを休止中です。
表示が崩れる場合は表示が崩れる原因の調査手順をお試しください。
その他の問題はFC2ユーザーフォーラムにお問い合わせください。
トラックバック
この記事のトラックバックURL

FC2 ブログでLinuxユーザーをケアする方へ
 今日は午前中にテンプレートを弄り間違い、テンヤワンヤしておりました(汗。ちょっと弄るにもバックアップを残してから弄るべきですね。 ...
[2009/08/29 20:48] Positive Thinking
ブログ内検索1
プロフィール

Author:いたお
更新は非常にマイペースです
現在休止中です

当サイトはリンクフリーです。

いたおの他の運営サイト
カレンダー
08 | 2016/09 | 10
- - - - 1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 -
なんでもスクロール
このように
縦に長く伸びた
プラグインを
スクロールバーによって
一定の長さに
抑えることが
出来ます。

※スクロールさせる文字やプラグインのHTMLをここに
今日の日付入りカレンダー

08 | 2016/09 | 10
- - - - 1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 -
ユーザータグ


△ ページトップへ戻る
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。