The Book Geek

To make your comments more readable you may have decided to put a uniform background under a comment section. But wouldn't it be awesome to make it a opaque, so they are more readable while your background image (presumably an awesome one that you want to show off) remains visible?

Bad news: we cant use an "opacity: 0.5" command. It affects all elements in a given section, so we'd end up with something like this:

And that is not cool. We wanted to make comments more visible! Not less.

Good news: there’s an easy and quick solution.

First we need to create a new class (I decided to call mine 'comments'):

.comments {background: rgba(0, 0, 0, 0.5);

With this way of doing it rgb colour values have to be used (red, green, blue – you declare how much of each colour you want. I decided to go with black, so I have three zeros. I’m smart like that).

Here’s a link to a page where you can get rgb colour values:

http://html-color-codes.info/

Last number stands for opacity of background colour  (0.5 -> 50%)

Go to settings -> blog -> customize -> edit html

Paste the code (before <*style> ):

Then find a piece of code responsible for comments. Type in things underlined with red (<*br> x3 creates a gap between a post and a comment section. If you don't want it, you can skip that particular part):

That's it. You're done! I told you it was easy ^^