divの色を変更せずにこの情報パネルの色をどのように変更しますか？

Question

このページでは、サムネイル、タグセット、その他の情報が左側のサイドパネルに表示されるブログ投稿が表示されます（http://www.elegantthemes.com/preview/TheStyle/2010/10/morbi-rutrum-interdum-justo/）。

私がしようとしているのは、この白いdivの黒い矩形を作成することです。白いdivの左上から、ポストテキストのちょうど左側に伸びる黒い矩形です。

最初は、1ピクセル幅の2色のイメージを作成し、 "偽の2列"レイアウトを上から下に拡張するためにrepeat-yを使用してみました。ただし、このdivは動的にサイズ変更されるため、多くの場合、投稿の黒いテキストがこのサイドバーに表示されます。

私は同じ方法で同じイメージを使ってみましたが、白いdivに "position：absolute"特性を与えました。これにより、右側のサイドバーが投稿コンテンツに流出しました。

この黒い矩形を作成して、投稿コンテンツの左にある空白を取りたいとします。

私は、どのように変更するのか分からない多くのCSSを継承しています。アドバイスをいただければ幸いです。 `

ここにstyle.CSSファイルを追加します。もしそうすることができたら、私はここにファイルを追加します。これは初めてのサイトです。

Answer 1

あなたがやろうとしている正確に何を解読するのは難しいですが、このことができますかどうかを確認：CSSを見ると

.post-content.info-panel { 
    background-color: black; 
    padding: 4px; 
    width: 28%; 
} 

Answer 2

を、それはあなたが言ったすべてが、独自のdiv内にあることを言う：

<div class="info-panel"> 

これで、CSSをそのクラスに変更するだけです。あなたのような何かをしたい：

.info-panel { 
    background-color: #000; 
} 

をしかし、それは良い見えるようにするために、あなたが同様の情報パネルとポストコンテンツのクラスのパディングとマージンを果たすべきである、ということに注意してください。私の解決策は、のために働いていた場合、私はどうなるのかにあるCSSから

.post-content { 
    background: url("images/entry-bottom-bg.png") repeat-x scroll left bottom transparent; 
    padding: 0 4% 30px 1%; 
} 

.info-panel { 
    background: none repeat scroll 0 0 #000000; 
    float: left; 
    margin-right: 1%; 
    padding: 2% 0 2% 2%; 
    width: 29%; 
} 

最後の2つのコードスニペットだけでいくつかのアドバイスを：

私はちょうどそれがよく見えるし、以下を含むことにより、同一の全体の幅を保つ作ら君は。 にはがあることを意味するものではありませんので、そのまま扱ってください。それはちょうどひどく見えるから区域を保つだけである。