スポンサーリンク

Google カスタム検索の検索ボタンがつぶれてる

スポンサーリンク

WordPress標準の検索ボックスに換えてGoogle カスタム検索を設置してみました。
ところが検索ボタンがつぶれて小さく表示されています。
それの修正です。

これがつぶれた状態。

修正後は

こうなります。

修正はCSSでおこないます。

input.gsc-search-button {
  box-sizing: content-box; }

table.gsc-search-box td {
  vertical-align: top!important; }

.gsc-input-box {
  height: 27px!important; }

input.gsc-search-button-v2 {
  margin-top: 0!important; }

ボタンのつぶれを直したら、微妙に入力ボックスとボタンの高さがズレていたので、併せて修正しました。

ボタンのつぶれだけなら1~2行目の「box-sizing: content-box;」だけでOKでした。

ご注意

当ブログの記事は全て記載した時点での内容となります。ご覧頂いた時期によっては情報が古くなっていることがあります。

HTML・CSS
スポンサーリンク
periodをフォローする

コメント

タイトルとURLをコピーしました