こんにちは、WPホームページ研究所の運営サポートチーム(@WP_LABO)です。
本日は業務メモです。selectボックスのレイアウト調整。元々のCSSでは下記になります。
CSSファイルはテーマフォルダ直下に入っているbase.css(333行目)あたり。selectの指定がありません。
/* form
---------------------------------------- */
form input[type="text"],
form input[type="email"],
form input[type="url"],
form input[type="tel"],
form input[type="number"],
form input[type="date"],
form textarea {
border-radius: 3px;
padding: 8px 13px;
max-width: 100%;
border: 1px #ccc solid;
outline: none;
box-sizing: border-box;
}
CSSを追記したあとの状態が下記です。
CSSを1行追加しています。記述ルールに乗っ取ってselectタグを足しました。
/* form
---------------------------------------- */
form input[type="text"],
form input[type="email"],
form input[type="url"],
form input[type="tel"],
form input[type="number"],
form input[type="date"],
form textarea,
form select {
border-radius: 3px;
padding: 8px 13px;
max-width: 100%;
border: 1px #ccc solid;
outline: none;
box-sizing: border-box;
}
今回は急遽なので親テーマ側のbase.cssを編集いたしました。先日にあった親テーマのアップデートを考えると子テーマ側にbase.cssを持ってきて調整する方がいいかもしれませんね。お好みで調整ください。
最新式の無料プラグインを事前公開
WordPressは公式サイトに登録済みのプラグインだけで全機能を補足しきれません。当サイトでは使いやすさを追求した魅惑的なプラグインを無料でダウンロードいただけます。運営ホームページのマーケティング力をさらに高めるチャンスです。まずは無料でDLしてお試しくださいませ。
→ 改良されたプラグインを確認する