Question

Is it necessary or bad practice to repeat properties that aren’t changing in each link type?
Like this:

a:link {display: block; width: 50px;}
a:visited {display: block; width: 50px; color: #000;}
a:hover {display: block; width: 50px; color: #FFF}
a:active {display: block; width: 50px; color: #FFF}

Does display block need to be in each? Or is that a bad practice?
Also, can you chain link states?
Like this:

a:hover, a:active {display: block; width: 50px; color: #FFF}

Additionally, when you have an added id/class on the links, should they inherit the default styles first, then change for the specific id/class?
Like this:

a:link {display: block; width: 50px; color: #000;}
....(etc)
a.menu:link {color: #FFF;}
....(etc)

Would the .menu link get display and width from a:link and then just change the color?

THANK YOU SO MUCH for any help clearing all this up!

Answer 1

You can chain link states.

:link and :visited are the most basic definitions for links. Statements made on them will be on every link on the page, even when a link has classes or id.

Said that, :hover and :active don’t need display:block, if you declared it on :link and :visited.