解決済
ブログのCSS改変について
ライブドアブログProのデザインに【マテリアル】の【ベルベット2カラム】を使っています。投稿を重ねる際、一つ目の記事と二つ目の記事とを恰も同一記事の連続のように繋げたいのです。なぜなら、記事タイトルを同一記事内の項目のように使いたいからです。CSSの.title{ にある
background: url(' ') no-repeat;
のdiamond（ダイヤモンドの写真）を前記項目の頭に配することが目的です。
日付は消しています。
上記目的をCSSの改変で達する方法はないでしょうか。
もし無ければdiamondの貼り付け操作をお教えいただけませんか。gifについて全く存じません。
宜しくお願い申しあげます。
回答(1)
1.
質問にある変更でうまくいきませんか？
画像と文字が重なるということであれば
文字をずらしてやる。(text-indent)
画像が大きくて全部表示されないということであれば
縦幅を拡げる。(height)
.title{
background:url('http://parts.blog.livedoor.jp/img/usr/velvet/diamond.gif') no-repeat;
height:50px;
text-indent:50px;
てな感じでいいと思いますが。再三のコメントにお応えいただき感謝です。
お世話になりました。
コメント(8)
質問の仕方がヘタでした。日付降順で記事を書く場合に、当日分の記事の文末と前日分の記事の記事タイトルとの間隔を詰めたいわけです。規定のCSSで書くとLINE-HEIGHT:25PXでの本文５～６行分ほどの空きが出来てしまいます。見た目、ブログタイトルが【章】、記事タイトルが【節】となるようにしたいのです。
宜しくお願い申しあげます。
質問の内容と、やりたいことのイメージがしにくいので、できたらブログのアドレスを教えて頂けますか？
>>#3 「だから、恥かしいけど４年前のこと、少し話しますね。」と「遊ばれて 飽きられるの もうタクサン！」との間隔
この間の間隔は、<BR> によるものと
.title{
margin-top:10px;
によるものです。記事の最後のＢＲは必要ないと思います。
あと、
.date{
が閉じていません。度々ありがとうございます。
.title{
margin-top:10px;は0pxにして一段と詰まった感じです。
なお一つ、.date{ の閉じ忘れはドコでお分かりになられたのですか。向後のためご教示ください。
宜しくお願い申しあげます。
>>#5 .date{ の閉じ忘れはドコで分ったのか？
Ｆｉｒｅｆｏｘで観た時に表示が崩れているので、ＣＳＳを点検していて気付きました。
あと、＃４でいうＢＲは、いわゆる改行のことです。
無知ゆえに、また困惑しています。
【Firefoxで観てOK】ということが大事なのでしょうか？
パソコンにあるMozilla Firefoxを開き、そこで件のアドレスを開いたところ、記事タイトル以下がブログの説明文の中ほどまで上がりダブってしまっています。また、全文が左端に寄ってしまっています。
普通に再構築終了後Google・Yahoo!でブログを観ますと、マトモなのですが。これでは駄目なのでしょうか。再三で申し訳ありませんが宜しくお願い申しあげます。
>>#7 【Firefoxで観てOK】ということが大事なのでしょうか？
それは、考え方次第だと思います。
以前(現在は違うと思いますが)に、自ブログを訪問してくれるユーザのブラウザの種類を調べてみたところ８割から９割がＩＥでした。
そういうことを考え(て訪問者がこういう環境であると推測でき)ると、ＩＥで(概ね)ちゃんと表示されていれば「ＯＫ」というのは、１つの考え方です。
私の場合で言うと、モジラ系のブラウザについては(現在は)Firefox で点検しておけばいいかなということで他のブラウザについては点検していません。
Firefox は、ＩＥなどに比べて規格に厳格であり、Firefox で点検して概ね思うように表示されているならば、他のブラウザでも(多少は違っても)同様に表示されていると期待できます。
(逆にFirefox でぐちゃぐちゃに表示されるならば、書き方に誤りがあると推測されます)
色々やってみましたが、Firefox で観ますと依然コメント#7の症状です。だいたい分際も弁えず『CSS』を弄ったのが間違いでした。ユーザーの８～９割がInternet Explorerであろうことを恃んで進めます。
ブログのアドレスからそのCSSまでが見られるなどは初耳でしたし、この度は大層勉強させていただきました。ありがとうございました。
