はてなブログの CSS について質問です。
添付図の通り、画像と文字の間に自動的に大きなスペースがはいってしまうため、これを縮めたいと思っています。どのような CSS を設定すればよいか教えていただけないでしょうか？
51
45
/* 自分で試しにいれてみたが反映されなかった設定 */
.hatena-fotolife img {
margin: 0 0;
border: 0;
padding: 0px;
}
/*
あまり関係無いかもしれないのですが
本文の文字サイズなどは entry-content クラスで指定すると反映されます。
*/
.entry-content {
font-size: 15px;
line-height: 1.9;
margin: 3.0em 0;
}
No.1
4973
2154
400pt
http://nihaoshijie.hatenadiary.jp/entry/2014/05/27/031847
↑の記事の画像であれば、画像自体に余白がついてます（ウィンドウの外側の影も含む）。
その画像に続く「図. CSS編集フォームの開き方」を囲んでいるタグもないので、画像の下側の余白を切り取らない限り、CSS だけで対処するのは、難しいと思います。
画像に、border: 1px solid green; で縁をつけ、padding も border もゼロになっている状態が、こちらの図です。
この、緑の線の内側を削らないと、大幅に詰めることはできません。
緑の線と「図．CSS編集フォームの開き方」の文字の間の隙間は、line-height が 1.9 になっているので、
.entry-content { line-height: 1.0; /* 1.9 → 1.0 */ }
とか、
.entry-content center { line-height: 1.0; }
で、多少は詰めることができますが、この図と図の説明の間だけを狭める以外にも、行の高さが変わってきてしまうので、質問の意図とは、ちょっと合わないと思います。
No.1
49732154
ここでベストアンサー
400pt
http://nihaoshijie.hatenadiary.jp/entry/2014/05/27/031847
↑の記事の画像であれば、画像自体に余白がついてます（ウィンドウの外側の影も含む）。
その画像に続く「図. CSS編集フォームの開き方」を囲んでいるタグもないので、画像の下側の余白を切り取らない限り、CSS だけで対処するのは、難しいと思います。
画像に、border: 1px solid green; で縁をつけ、padding も border もゼロになっている状態が、こちらの図です。
この、緑の線の内側を削らないと、大幅に詰めることはできません。
緑の線と「図．CSS編集フォームの開き方」の文字の間の隙間は、line-height が 1.9 になっているので、
.entry-content { line-height: 1.0; /* 1.9 → 1.0 */ }
とか、
.entry-content center { line-height: 1.0; }
で、多少は詰めることができますが、この図と図の説明の間だけを狭める以外にも、行の高さが変わってきてしまうので、質問の意図とは、ちょっと合わないと思います。
ご回答いただき、誠にありがとうございます(´；ω；`)ﾌﾞﾜｯ
追って参考にして修正にチャレンジしたいと思います。
ご回答いただき、誠にありがとうございます(´；ω；`)ﾌﾞﾜｯ
2014/08/22 01:51:52追って参考にして修正にチャレンジしたいと思います。