Anidan Design » CSS http://anidandesign.com Web design, Wordpress, and Graphic Art, tips, tricks, and tidbits Wed, 21 Jul 2010 21:40:33 +0000 en hourly 1 http://wordpress.org/?v=3.0 Change the style of selected text http://anidandesign.com/css/change-the-style-of-selected-text-in-firefox/ http://anidandesign.com/css/change-the-style-of-selected-text-in-firefox/#comments Tue, 14 Jul 2009 10:30:31 +0000 dani http://anidandesign.com/?p=752 I recently learned this neat little css snippet that allows you to style selected text (this only works in Firefox… but really… what else matters? ;) )

Just put the following code somewhere into your stylesheet making sure to change the background and color to match your own design! For an example of this code in action just select some of the text here on my site :) 

*::-moz-selection { background: #000 none repeat scroll 0 0; color: #fff; }

Update!

This same effect can be used in Safari as well by including the following code:

::selection { background: #000 none repeat scroll 0 0; color: #fff; }

Thanks to Andrew Houle of myinkblog.com for that tip :D !

Related posts:
]]> http://anidandesign.com/css/change-the-style-of-selected-text-in-firefox/feed/ 36 One pixel notched corners as used by Google Analytics http://anidandesign.com/web-design/css-one-pixel-notched-corner-trick/ http://anidandesign.com/web-design/css-one-pixel-notched-corner-trick/#comments Fri, 16 May 2008 09:47:23 +0000 dani http://anidandesign.com/css/css-one-pixel-notched-corner-trick/ The CSS guy explains how to create rounded corners in CSS using the same notched corner approach as seen in the navigation of Google analytics.

Ask the CSS guy

]]> Yet another way to create rounded corners but this one uses no images…

The CSS guy explains how to create rounded corners in CSS using the same notched corner approach as seen in the navigation of Google analytics.

Ask the CSS guy

View full article –> One pixel notched corners as used by Google Analytics (Ask the CSS Guy)

Related posts:
]]> http://anidandesign.com/web-design/css-one-pixel-notched-corner-trick/feed/ 4 8 fonts you probably don’t use in css, but should http://anidandesign.com/web-design/eight-fonts-you-probably-dont-use-but-should/ http://anidandesign.com/web-design/eight-fonts-you-probably-dont-use-but-should/#comments Fri, 16 May 2008 09:31:40 +0000 dani http://anidandesign.com/css/eight-fonts-you-probably-dont-use-but-should/ 3.7crea.tv!]]> Great reminder! I myself am totally guilty of using just a select few "typical" fonts such as arial and Georgia. This article is an excellent reminder of those "forgotten" fonts! Thank you 3.7crea.tv! (Spend some time at this site, excellent css articles and I LOVE the site design!)

8 fonts you probably dont use but should

View full article –>  » 8 fonts you probably don’t use in css, but should

Related posts:
]]> http://anidandesign.com/web-design/eight-fonts-you-probably-dont-use-but-should/feed/ 2 CSS Text Wrapper http://anidandesign.com/web-design/css-text-wrapper/ http://anidandesign.com/web-design/css-text-wrapper/#comments Sun, 27 Jan 2008 04:52:54 +0000 dani http://anidandesign.com/2008/css-text-wrapper Have you ever wanted to wrap text around an unconventional shape?

Check out this new tool from the Idea Shower that allows you to do just that.

CSS Text Wrapper by the Idea Shower

CSS Text Wrapper

“The CSS Text Wrapper allows you to easily make HTML text wrap in shapes other than just a rectangle. You can make text wrap around curves, zig-zags, or whatever you want. All you have to do is draw the left and right edges below and then copy the generated code to your website.”

Related posts:
]]> http://anidandesign.com/web-design/css-text-wrapper/feed/ 0 CSS Gradient Text Effect http://anidandesign.com/web-design/css-gradient-text-effect/ http://anidandesign.com/web-design/css-gradient-text-effect/#comments Mon, 21 Jan 2008 13:38:32 +0000 dani http://anidandesign.com/2008/css-gradient-text-effect cool new trick by Web Designer's Wall that creates fancy gradient headings using CSS.]]> Check out this cool new trick by Web Designer’s Wall that creates fancy gradient headings using CSS.

Gradient text Effect Samples Screenshot

CSS Gradient Text Effect

Related posts:
]]> http://anidandesign.com/web-design/css-gradient-text-effect/feed/ 1