CSS | Psyked

Targeting multiple browsers with CSS… and some Javascript trickery.

by James on 28th November, 2009 in CSS, JavaScript

There’s a clever little javascript library that allows you to write CSS specifically for Chrome, the iPhone, IE 8, etc. all in a single file. What it does is manipulate the HTML document client-side to add additional classes to the page, based on your browser type. The end result is that your page gets additional selectors like .ie or .gecko added – and you can setup a single CSS file to target all of these browsers in one shot – no server side magic or conditional comments in the HTML.

You can find more information here ( http://snipplr.com/view/9340/css-browser-selector/ ) or download it from here (http://github.com/rafaelp/css_browser_selector ).

Everything you know about CSS is wrong.

by James on 31st October, 2008 in CSS

http://www.digital-web.com/articles/everything_you_know_about_CSS_is…

CSS Selection Styles?

by James on 24th February, 2008 in CSS

Did you know you could customize the selection colours of html pages with CSS? I didn’t – until now. Turns out, there’s a CSS3 pseudo-element called ::selection. Naturally, this isn’t yet a technique supported by browsers like Internet Explorer, but it is supported in [albeit with different syntax] by Firefox and Safari. Interesting, eh? Check an article on CSS Selection Styles from Quirksmode, and have a look at some of the creative effects you can get with it here.

Automatic Link Icons v2.0

by James on 8th January, 2008 in CSS

Wow. My previous post, Auto-matic Link Icons is by far the most popular on Psyked. It’s even been translated into Russian! Things are constantly evolving, and I thought it only suitable that I should expand upon the original with a few new ideas, techniques and general improvements. So, without further ado:

Improving the Icon Display;

In the original post, I put forward the following code for adding link icons; Read More…

Displaying Link locations with CSS

by James on 27th November, 2007 in CSS

Why would you want too?

How often is it the case that you’re not quite sure where a link is going to take you? Ok, so it’s not a major issue for mainstream browsers – after all, that’s what the “Status bar” is for. But beyond your normal browser operation – say on an unusual machine or if you’re looking at a print-off – just how can you tell where a link should be going? If the link text is good, you might be able to track down the target page, but that’s nothing compared to the usefullness of a full URL.

Luckily with a smidgen of CSS and an up-to-date browser, you can solve at least a few of these problems in a nice, clever way. A List Apart covered this in the misty old era of 2002, back when I was still making HTML pages with notepad and cobbling together images with Trial versions of Paint Shop Pro. In the article, CSS Design: Going to Print, they Eric Meyer covers – amongst other things – the issue of displaying ‘Printed links’, making links that are as useful in print as they are functional onscreen. Read More…