dポイントプレゼントキャンペーン実施中!

CSS html編集初心者です。

横幅の編集で、下記の部分を100pxずつ増やしました。
#container{
width:1210px;

#content{
width:620px;

すると見出し部分の背景色が、反映させることができません。(画像参照)

どこのタグの何という部分を編集すればよいのでしょうか?

些細なことでも構いませんので、アドバイスお願いいたします。

使用テンプレート(seesaaブログ、シンプルベージュ(両サイドバー))

「CSS html ブログの横幅の編集」の質問画像

A 回答 (1件)

このデザインの日付や記事タイトルの部分は単なる「背景色」ではなく、「背景画像」が用いられており、コラム幅の変更をすると、あなたのいう状態になる。


即ち、画像を用いたデザインでは拡げたサイズの画像に「作りなおして CSS 設定」するのがフツー。
特に「角丸」は画像を使うのが一般的だった時代のデザインであること。
IE が遅れていたが、今や角丸もシャドウも CSS で描画できるようになった。
.date{ /* 日付部分 */
display:block;
text-align:left;
padding:8px 0px 7px 10px;
line-height:1;
color:#333333;
font-weight:normal;
background-image:url("http://blog.seesaa.jp/img/bg/simple_gray_2/date_ … /* この行から */
background-repeat:no-repeat;
background-repeat: no-repeat;
background-position:top center; /* ここまで削除 */
background: rgb(218,212,190); /* 以下三行追加 */
box-shadow: rgba(204,197,178,1.0) 0 0 2px inset;
border-radius: 5px;
}
h3.title{ /* 記事タイトル */
padding:0px 10px 0px 20px;
line-height:1.5;
overflow:hidden;
background-image:url("http://blog.seesaa.jp/img/bg/simple_gray_2/title … /* この行から */
background-repeat:no-repeat;
background-repeat: repeat;
background-position:top center; /* ここまで削除 */
background: rgb(245,245,243); /* 以下二行追加 */
box-shadow: rgba(228,227,225,1.0) 0 0 2px inset;
}
    • good
    • 0
この回答へのお礼

大変ありがとうございました。

コードまで、書いていただき感激です。

今後も勉強してまいります。

お礼日時:2014/11/06 22:26

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!