selectors types syntax + grouping 3

[Sleidia]

Hi guys,

I've just discovered that it is possible to select stuff like submit buttons without the need to make a class :

    input[type="submit"] {
    
    margin-top: 5px;
    background: #dbdbdb;
    color: #336699;
    
    }

Now, I want to know if there are other syntaxes that do the same thing and how to group types in the same selector.

Thanks for the help!

 

[Vragabond]

http://www.w3.org/TR/REC-CSS2/selector.html

This is a very good reference on possible selectors. I would advise you a lot of testing though, because IE6 did not support attribute selectors.

 

[monksnake]

I don't think IE recognizes attribute selectors like

input[type="submit"].

I'll give you a link from W3C that can inform you a lot better than I can.

http://www.w3.org/TR/REC-CSS2/selector.html

<.

 

[monksnake]

haha this is CRAZZZYYY!!

<.

 

[Vragabond]

monksnake, actually, as of IE7, IE supports attribute selectors as well. IE7 is not such a bad product after all.

 

[monksnake]

Thanks for the info Vragabond. I don't know jack about IE7 because I'm forced to run Windows Server 2000 on my work computer and IE7 won't run on it.

IE7 is not such a bad product after all.

It's still no FF.

<.

 

[Sleidia]

I don't think IE recognizes attribute selectors like

input[type="submit"].

Aaaargh .... you're right ! And I thought it was nifty

This is a very good reference on possible selectors. I would advise you a lot of testing though, because IE6 did not support attribute selectors.

well ... why bother looking at w3.org when browser makers do whatever they like?

Instead, I prefer to ask guys who have an efficient hack that they use constantly.

 

[Foamcow]

Here's what I do to accomodate IE6.

As a matter of course I add a class called 'button' to any buttons I make.

Then, using IE conditional comments, I create a 'hacks.css' that sets style rules for the button class.

This means that I can use CSS selectors in my 'normal' stylesheet and only over-ride this when necessary.

Of course, you could just add a button class and have done with it, but to me it seems better to use the 'proper' technique until IE6 goes away enough to ignore.

<honk>*:O)</honk>

Earl & Thompson Marketing - Marketing Agency Services in Gloucestershire

 

[Sleidia]

Personally, I've chosen the following path :

- Always use a single css file for all the browsers
- Never rely on hacks that don't work anymore after browsers version change (ie: ie7)

It's just K.I.S.S strategy.

That's why, for submit buttons, I've decided to keep using a class.

 

[Sleidia]

And BTW, IE6 isn't going to die as fast as you may want.

 

[Foamcow]

The point is, it doesn't matter how long IE6 is around. It's nothing to do with me 'wanting' it do die. I don't really mind and still deal with corporate clients that are tied to IE6 for a number of reasons from simple caution to Java limitations. The number of IE6 users is certainly reducing though and there will come a point where there are few IE6 users. Give it 18 months.

The stylesheet with the IE6 stuff is only ever loaded by IE6, and it does this using a perfectly valid structure that is recognised by IE browsers - IE conditional comments.
IE conditional comments are just that, HTML comments - These will always be supported as comments. The older browsers they are targetting already support them so there is no risk of them never working.
Using this technique lets me target the additional sheet to pre 7 versions of IE. In fact, the extra sheet is often just a few over-riding rules that utilise the cascading nature of stylesheets.

Within both stylesheets is perfectly valid CSS. There are no CSS hacks used.

As I said, I could just use a class. I just feel that this way is allowing me to get to know these CSS selectors and gain some experience using them while also retain support for IE6. Using CSS 'properly'.

<honk>*:O)</honk>

Earl & Thompson Marketing - Marketing Agency Services in Gloucestershire