サイト内検索
ロゴ画像下のスペースにつきまして | Cocoonテーマに関する質問 | Cocoon フォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
対象のページのURL：
相談内容：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
また、問題の解決に至った場合には、トピック冒頭の「解決済み」リンクをクリックしていただけますと幸いです。
また、有用な返信があった場合は「いいね！」リンクもご活用ください。返信者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。
Topic starter2020年9月28日 03:34
わいひらさん
いつもお世話になっております。
別のトピックを書きこみ終わるころに気づいたのですが、ヘッダー、固定ヘッダー、フッターのロゴを画像に設定した際に、画像の下にaタグのスペースが出来ています。
これも、フォーラムで回答している時にちょっと気になっていたのですが、すっかり忘れていました。
ロゴ画像の img タグに vertical-align: middle; とか vertical-align: bottom; とか、どちらでも良いのですが、vertical-align の指定を当てておくと、ロゴ画像下の余分なスペースがなくなるような気がします。
特に固定ヘッダーのときは、上下のスペースが狭いので上下中央に配置しやすくなるような気がしました。
全てのブラウザや、さまざまなロゴ画像のサイズで検証した訳ではないので、間違っているかもしれません。
フッター下の隙間の件のときに一緒に書いておけばよかったです。すみません。
This topic was modified 12か月前 5回 by リフィトリー
Topic starter2020年9月28日 03:55
でも、いきなり、vertical-align: middle; を指定すると、上下方向のデザインのバランスが狂っちゃった、という苦情があるかもしれない、と、いう心配も 無きにしも非ずではあります。
Ikumi 件のいいね！
2020年9月28日 20:07
ありがとうございます。
とりあえず修正しておきます。
https://github.com/yhira/cocoon/commit/ba805bec8a41dcca37875c4c110051f554c8291b#diff-da232d78aa810382f2dcdceae308ff8eR697
でも、いきなり、vertical-align: middle; を指定すると、上下方向のデザインのバランスが狂っちゃった、という苦情があるかもしれない、と、いう心配も 無きにしも非ずではあります。
個人的には大丈夫のように思います。
ただ、もし不具合がある場合は速やかに元に戻すだけです(笑)
コミットを判断したのも僕なので、もし問題があったとしても僕の責任です。
いずれにせよ、大きな不具合となるような修正ではないので、大丈夫だと思います 🙂
Ikumi 件のいいね！
Topic starter2020年9月28日 20:35
@yhira さん
個人的には大丈夫のように思います。
ただ、もし不具合がある場合は速やかに元に戻すだけです(笑)
コミットを判断したのも僕なので、もし問題があったとしても僕の責任です。
いずれにせよ、大きな不具合となるような修正ではないので、大丈夫だと思います 🙂
そのように、おっしゃっていただくと、気持ちが軽くなります。
ヘッダーやフッターの画像の場合は、あまり気づかれないこととは思っていましたが、固定ヘッダーで、ロゴが上下中央に配置されないという お問い合わせは、幾度か あったような気がします。
それが、解消されれば幸いなのですが・・
This post was modified 12か月前 by リフィトリー
Topic starter2020年9月30日 19:31
@yhira さん
フッターに何もコンテンツを入れない状態で、ちょうど上下幅の中央ぐらいになっています。(でも、これは、画像の高さによって変わるのでしょうか？)
img タグの下方向に意図せずできてしまうマージン？は Firefox のデベロッパーツールで見てみると、10.7pxのようです。
これに先日フッターに８pxの paddingを設定していただいたので、画面下端からの距離は、
8px + 10.6px ＝ 18.6px
になっているようです。
ですので、この フッターロゴの img タグに vertical-align: middle; を指定した場合は、ウィンドウ下端からは、8px となり、下に寄ったような表示になるかと思います。
This post was modified 12か月前 3回 by リフィトリー
Topic starter2020年9月30日 20:48
img タグの下方向に意図せずできてしまうマージン？は Firefox のデベロッパーツールで見てみると、10.7pxのようです。
これに先日フッターに８pxの paddingを設定していただいたので、画面下端からの距離は、
8px + 10.6px ＝ 18.6px
になっているようです。
誤記、訂正します。 😓
8px + 10.7px ＝18.7px
返信する
フォーラムの統計
13フォーラム
7,226トピック
55.8 K投稿
28オンライン
8,283会員
最新の投稿: 画像の中央揃えについて 最新のメンバー: cracklcvjvgq936 最近の投稿 未読の投稿
