8052

Currently Reading

The Santa Klaus Murder
Mavis Doriel Hay, Anne Dover, Gordon Griffin
The Santa Klaus Murder
Mavis Doriel Hay
Sherlock Holmes: The Definitive Collection
Arthur Conan Doyle, Stephen Fry
Merlin Trilogy
Mary Stewart
Progress: 340/928 pages
The Adventures of Sherlock Holmes
Arthur Conan Doyle

Recently Added

A Rising Man - Abir Mukherjee
Dark Carnival - Nancy K Duplechain
The Bad-Ass Librarians of Timbuktu: And Their Race to Save the World's Most Precious Manuscripts - Joshua Hammer
"You only live once, but if you do it right, once is enough." ― Mae West


"The man who does not read has no advantage over the man who cannot read." ― Mark Twain


"Women and cats will do as they please, and men and dogs should relax and get used to the idea." ― Robert A. Heinlein


"Always be a first rate version of yourself and not a second rate version of someone else." ― Judy Garland
Find me elsewhere:
My Leafmarks Profile
Project Hamlet

A see-through background for comment section (100% text visibility) (Reblogged from Anna)

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 transparent 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);}

 

!!!Make sure to copy this line it it's entirety, commas, semicolons, the whole thing.!!!

 

 

!!!WARNING!!!

 

If you have a wooden them you can't name class "comments". It messes with pre existing classes. You could go with (I've tried, it worked):

.commentsbg {background: rgba(0, 0, 0, 0.5);}

 

 

(or anything else you want) I should have just stuck with silly names like "dumbledor" or "aragorn" or "cake". Change it accordingly in all (two) places.

 

 

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> ):

 

 

or

 

 

 

 

Then find a piece of code responsible for comments ( This part is responsible for normal comments - and please, use a search bar!)

 

 

 

 

Those are special comments (Facebook ones and Disqus):

 

 

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)

 

 

 

If I wanted it this colour: