【テーマ編集】検索窓search-boxの幅を縮めてボタンのズレを修正する
当サイトで愛用中の
TCDテーマ「Reviewer」のカスタマイズ例です。
編集するテーマ：Reviewer TCD026
編集するファイル：style_sp.css
ｻｲﾄのかなめ
スマホ表示時のサイドバー機能を充実させよ～
今日はwidgetに検索BOXを設置してみよう。
…あれ？ボタンがズレた。助けて～ ｻｰﾊﾞｰｶﾞｰﾙ！
今日はwidgetに検索BOXを設置してみよう。
…あれ？ボタンがズレた。助けて～ ｻｰﾊﾞｰｶﾞｰﾙ！
ｻｰﾊﾞｰｶﾞｰﾙ
かなめちゃん、サイト装飾で困ってるならCSSを修正してみたら？
#search-boxの幅を調整する
|
1 2 3 4 5 6 7 |
/* search */ .widget_search #search-box, .widget_search #s { width:80%; margin:0 0px 5px 0; } .widget_search #search-btn input, .widget_search #searchsubmit { width:14%; } /* google search */ .google_search #search_input, .google_search #s { width:80%; margin:0 0px 5px 0; } .google_search input#search_button, .google_search #searchsubmit { width:14%; } |
width:80%; 2箇所を、
width:70%; に変更する。
⇓
|
1 2 3 4 5 6 7 |
/* search */ .widget_search #search-box, .widget_search #s { width:70%; margin:0 0px 5px 0; } .widget_search #search-btn input, .widget_search #searchsubmit { width:14%; } /* google search */ .google_search #search_input, .google_search #s { width:70%; margin:0 0px 5px 0; } .google_search input#search_button, .google_search #searchsubmit { width:14%; } |
