メインコンテンツに移動
ホーム

古松

メインナビゲーション

  • ホーム
  • ビデオ
  • ご連絡

パンくず

  • ホーム
  • 複数のソーシャルボタンの並びずれがあるので、cssで簡単に配置調整

複数のソーシャルボタンの並びずれがあるので、cssで簡単に配置調整

やりたいこと:複数のソーシャルリンクボタンを一行に配置

  • 複数のソーシャルリンクボタン(例:Twitter、FacebookのFollowボタン)を一行に配置したいです

問題点:ボタンが同じライン上に揃っていない

  • 各ボタンのcss設定が違うため、一行配置時に、同じラインに揃えるのは難しいです
  • FacebookのFollowボタンのcss設定が時にその要素のstyleに書き込んだため、追加したcssファイルの設定が優先度低いため、上書きすることが難しいです(!impotantキーワード使用だったら可能かな?)

解決:ボタンをラップする親ボックスの配置を調整

  • ボタンを構成する要素のcssの上書きが難しい場合、ボタンをラップするブロックの配置場所を調整することより、ボタンを揃えます
  • 例:FacebookのFollowボタンをラップする親クラス:class=”fb-follow”のcss設定に、top:-2pxを設定すれば、二つのボタンを一行に揃えました。

検索フォーム

カテゴリ別

  • laravel
  • drupal
  • javascript
  • windows
  • html
  • mysql
  • php
  • apache
  • css
  • SEO
  • video
  • wordpress
  • linux
  • python
  • Electron
  • Visual Studio Code

google ads