Dr. Strangeswitcher Article

Comment 1

Hi,

Thats a nifty trick there, but since you still need scripting, why not write a one line javascript that does the same trick for all browsers?

The approach I usually follow is: document.body.className = "alt1"

and in the stylesheet make a section

body a {
}

body.alt1 a {
}

Etc.

What do you think?

So said Arjen Geerse on Wednesday 1 June, 2005 at 3:53PM GMT.

Comment 2

Neat, though how do you set cookies with CSS?

Certainly a bloody good idea though Patrick and ideas are a brewing! Thanks for sharing.

So said John Oxton on Wednesday 1 June, 2005 at 4:50PM GMT.

Comment 3

So Opera isn't "a decent, modern browser" heh?

You made me launch Firefox but it's interesting.

So said ghola on Wednesday 1 June, 2005 at 8:34PM GMT.

Comment 4

Very cool, the :target is really powerful. I don't think we as developers have really used this to full effect yet.

I was doing some :target and display: none stuff so when you lead visitors to a contact form though different anchors the subject would already be filled out.

Contact Sales, Contact Helpdesk etc

So said Tom on Wednesday 1 June, 2005 at 11:17PM GMT.

Comment 5

hmm my links died?

http://www.example.com/contact#sales
http://www.example.com/contact#helpdesk

You get the idea.

So said on Wednesday 1 June, 2005 at 11:17PM GMT.

Comment 6

Trying to make this work over multiple pages could be a bit troublesome, but a good idea from Patrick again

So said SteveC on Thursday 2 June, 2005 at 4:08PM GMT.

Comment 7

Oh, and because it only works in Good browsers can't you use
element:before { content: 'link' }
to make the style switcher?

So said SteveC on Friday 3 June, 2005 at 8:14PM GMT.

Comment 8

The first HTML example codes in the article seems to have few mistakes, especially the closed a tags?

So said Lim Chee Aun on Sunday 5 June, 2005 at 1:44AM GMT.

Comment 9

Ah. Damn. They were in the wrong place. Fixed now. Ta.

So said Patrick on Sunday 5 June, 2005 at 8:35AM GMT.

Comment 10

Safari 1.3 isn't a "decent, modern browser?" After today I'd have to at least agree with anyone saying it's sure got a few problems with images. 1.3 (v312) bombs on the positioning of the (ironically) nuclear bomb blast image putting its lower left corner at the bottom center of its containing box. (btw - best design for a demo page I've seen in awhile!)

Your http://www.htmldog.com/articles/elasticdesign/demo/ article also uncovers a bug. The first image doesn't resize with the font but tiles (and tiles from the bottom left corner instead of the usual top left).

And then there's http://www.alistapart.com/articles/cssdropshadows where 1.3 places the right side shadow about 10px too far to the right on images but works fine on the text block examples.

I happened upon all 3 of these errors today. Thinking maybe I should switch to FF as my primary browser ...

So said Paul on Monday 6 June, 2005 at 11:33PM GMT.

Comment 11

Quite intresting article.Ilike this.

So said Carter on Friday 12 August, 2005 at 11:47AM GMT.

Comment 12

Does anybody tried to use the trick along with the 'display' option? I tried to use it to toggle some elements on and off in my page, but it seems to not work with the display feature.

So said Santiago on Friday 28 October, 2005 at 5:05PM GMT.

Comment 13

Great article I think you and strangelove did a excellent job.

So said Jessica on Thursday 17 November, 2005 at 6:06AM GMT.

Comment 14

After today I'd have to at least agree with anyone saying it's sure got a few problems with images. 1.3 (v312) bombs on the positioning of the (ironically) nuclear bomb blast image putting its lower left corner at the bottom center of its containing box. (btw - best design for a demo page I've seen in awhile!)

So said Dimon on Wednesday 28 December, 2005 at 4:56PM GMT.