[thelist] Tip: "Invisible" CSS Buttons

[Karl Jacobs]

Howdy,

Thought I might share this, as it seems to work, and I haven't heard of 
this discussed before.

I needed to link a logo that is imbedded in a background image. The 
solution?...  I created a div with linked text inside it, and styled is 
as:

#logolink {
	float: left;
}

#logolink a {
	width: 200px;
	height: 50px;
	color: #fff;
	font-size: 1px;
	line-height: 1px;
	display: block;
	text-decoration: none;
}

The float positions the "button" over the logo in the background image 
of the container div.

It works in all the browsers I tested.  I have the text styling in 
there so screen-readers will pick it up, and it is sized so it matches 
my logo-bar div.

Anyone see an error in my setup?...   Forgive me if this is old-news, 
but I haven't seen this mentioned before.

-- Karl