注目タグ

質問・疑問

トピック詳細

記事、プラグインに枠を表示させたい。


初めまして。

記事、プラグイン?(サイドバーの場合、申し訳ありません。)に枠をつけ、中に好みの色をつけて見やすくしたい。
ブログはこちら(http://neorisugiguchi.blog.fc2.com/)になります。
見ての通り、背景の色に埋もれて見ずらいため、白地の枠をつけたいのです。

ただ、全くもって知識を持っておらず、サイトで調べまくりようやくヘッダーもつけれました。
しかし、肝心の枠が思うようにはいかず、どれほど探してもわかりません。
わかる方、教えてくださると幸いです。
SUP04_1を使用しております。

2014年12月21日 22:47  by 椙口音織

コメント一覧 4件中、1~4件表示

  • >>yosoilue様

    書き込み、ありがとうございます。
    ようやく調整完了しました、わがままに付き合ってもらいありがとうございます。

    今後、また質問する事があればyosoilueのお言葉を参考にIEやURLなど、ちゃんと理解したうえで掲載するよう心がけ ます。
    一旦これで一通りのことは終わりましたので現段階ではこれ以上質問する事はありません。

    この度は誠にありがとうございました。

    2014年12月23日 04:05 by 椙口音織

  • 見え方の調整の場合にはご自身が何を使って見ているのかを書かないとわかりません。
    多分InternetExplorer11を使っての話だとは思いますが。

    1.ヘッダーの右側に余白
    これは画像の方をサイズを合わせたほうがいいです。横に引き伸ばされてみっともなくてもいいのなら別ですがそうでないのならば 、テンプレート作者のブログの記事にあるように画像の幅を960pxにしてください。
    http://slugsupper.blog22.fc2.com/blog-entry-109.html

    2.ヘッダーにタイトル文字及び説明文が重なって消したい。
    上記のブログ記事に書いてあります。

    3.カレンダーが記事に重なっている。
    これはカレンダーという認識でホントウにあっていますか?カレンダーはブログの一番上にあるヨコ型のものです。

    記事に重なっているのは記事部分にある日付の数字ではないのでしょうか?これはIE以外のブラウザーで見てみれば重なっては見 えないはずです。

    もしもこちらのことであるのならば、原因はHTMLに記載されている下記の部分が、

    <meta http-equiv="X-UA-Compatible" content=&qu ot;IE=8" />

    IE8モードで表示させるようになっているためです。

    <meta http-equiv="X-UA-Compatible" content=&qu ot;IE=edge" />
    赤文字部分を修正すれば直るとは思います。

    2014年12月22日 23:32 by ロギラキ

  • >>yosoilue様

    書き込み、ありがとうございます。
    本文を参考に一度、SUP04_2に変えてみた所、見やすく気に入りました。
    ありがとうございました。



    =====

    その後、色々調整してヘッダーの変更まで進みましたが

    ・ヘッダーの右側に余白ができた。
    ・ヘッダーにタイトル文字及び説明文が重なって消したい。
    ・カレンダーが記事に重なっている。削除したいが色々サイトを見て回りカレンダーらしきものを見つけて削除しても消えない。

    上記の三点、もしよければ引き続き答えてくださると幸いです。
    宜しくお願いいたします。

    2014年12月22日 13:36 by 椙口音織

  • イラストを目立たせるのが目的なのならば、いっその事【SUP04_2】の白バック色に変えたほうがいいような気がするのですが 。
    http://neorisugiguchi.blog.fc2.com/?share=36223&index


    どうしてもやるのならば
    1.記事を枠で囲む
    CSSの下記に赤文字部分を追加。
    /*========== Entry ==========*/
    #entry{
    width: auto;
    margin: 0 0 30px 0;
    border: 1px solid #fff;
    clear: both;
    }

    2.プラグインを枠で囲む
    CSSの下記の赤文字部分を削除。
    /*========== Plugin ==========*/
    .plugin1{
    padding: 0 0 10px 0;
    border-left: 1px solid #fff;
    }


    .plugin2{
    padding: 0 0 10px 0;
    border-left: 1px solid #09f;
    }

    2014年12月22日 10:12 by ロギラキ