Q:

Clicking on URL 'bumps' the text/image a bit

I'm currently working on a website but after a while I started to notice how the text and images 'bump' a little when you click on them. I have no idea how this started to happen and I have no idea how to get rid of it either. There's also a few other problems that started happening around the same time.
Examples:

Clicking the logo makes it move around a bit.
Clicking one of the breadcrumbs makes it look like it's suddenly bold
The titles for my posts are in white (thus invisible), even though I set them to be semi-black. When clicking on them the text shows up (changes color like it's supposed to do) but it also decreases in font-size significantly.

I tried css and html validator but it says my website is actually valid.
Help is very much appreciated!

A:

You have things like this in your CSS:
#breadcrumbs a, a:visited, a:active { ...

This is the same as:
#breadcrumbs a { ...
a:visited { ...
a:active { ...

You are accidentally giving all anchor elements some padding when they are clicked, that is why your logo jumps a bit.
The boldness is caused by a similar expression:
.post-title a, a:active, a:visited {
    color: #3e3e40;
    font-weight: bold;
    font-family: "Helvetica", Tahoma, Geneva, sans-serif;
}

That makes all links on the page bold when clicked.
The correct way to write these compound selectors is to include the whole chain in each expression:
#breadcrumbs a, #breadcrumbs a:visited, #breadcrumbs a:active { ...

