Mozilla Flavored Popups
Rounded corners are cool. But what about rounded corners on ordinary, inline links? What about rounded corners on CSS popups? Is it possible? Yes it is. But there are no new techniques here. Just a slight variation on existing ones.
Since becoming acquainted with the ingenious Nifty CornersA technique for adding rounded corners to page elements without the use of images effect I've designed a number of web pagesA redesign of the Kill Television series which make use of it. I also read an articleLachy's application of Fitt's Law for enhanced link clickability recently explaining how to increase the size of the hover area of a link without disturbing the natural inline flow and line-height of paragraphs, and this method has been applied to the links on this page. It occured to me that I might combine these two techniques. Alas, with my limited expertise I was not able to pull it off.
As you can see, I've applied the Pure CSS TooltipsA no-javascript method for creating CSS-styled title boxes on hover styling to the links. I've also applied the -moz-border-radiusA CSS property for applying rounded borders, not supported by IE property to both the links and the popups as an alternative to Nifty Corners. My intent was actually to apply a method Article: Teaching IE how to do Border Radius for styling the borders so Internet Explorer could also display the rounded effect. I was unable to get this method to work on the links or popups. It's probably a Pseudo ClassOnly speculation on my part. I really have no idea thing.
For Internet Explorer users: the screenshot on the left shows the appearance of the hovered link and popup span as they appear in the Firefox Browser. The "border-radius for IE" effect built into this page has failed.
Is there a way to apply theseNifty Corners techniquesIE Border Radius to links and hover spans? I think I need some heavyEric Meyers, creator of the CSS-enhanced S5 Slideshow suite hittersStu Nicholls' CSS Play site: Advanced CSS techniques to weigh in on this one. For now this demo is just eye candy. Internet Explorer users will find it degrades gracefully, though the rounded effects are lost. Thoughts or comments? ContactA link to my site. My e-mail address is headsfromspace at gmail dot com me.