A see-through background for comment section (100% text visibility)
Reblog from AnHeC. Thank you, thank you, thank you!
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:
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 ^^
1
)
