Welcome to WebmasterWorld Guest from 23.20.230.24

Forum Moderators: not2easy

Message Too Old, No Replies

Attribute Selectors

using attribute selector with #id

     
7:30 am on May 14, 2003 (gmt 0)

10+ Year Member



Hi all

I am trying to override a given value by using the attribute selector. i can make it work by applying it to .class but cant make it work with #id.


#sidemenu a {
padding-left: 2px;}
a[id="sidemenu"] {padding-left:15px;}

in my css i use this and it works fine for another job:


a.questions {width:96px;}
a[class="questions"] {width:90px;}

Ive read the specs. for using this selector and it should work fine with #id but i cant seem to find the answer and i would like to avoid using the .class solution. My doc type is xhtml, strict with xml declaration.

thanks in advance
Hafnius

10:37 am on May 14, 2003 (gmt 0)

10+ Year Member



id="sidemenu" is unique, so what is the point of overriding it?
If you are using:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

at the top of your document you are in fact in quirks mode in IE6.

11:40 am on May 14, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



First problem, attribute selectors are not supported in IE.

Second problem,

#sidemenu a
is not the same as
a[id="sidemenu"]
. The first one identifies a link that appears inside an element whose id is "sidemenu" - whereas the second identifies a link whose own id is "sidemenu".

So..

#sidemenu a == *[id="sidemenu"] a

a#sidemenu == a[id="sidemenu"]

Why are you doing this any way?

Why not just...


#sidemenu a {
padding-left: 2px;
}
/* ..and then override this with.. */
#sidemenu a {
padding-left:15px
}

?

8:49 pm on May 14, 2003 (gmt 0)

10+ Year Member



Hi

alrighty then.

Why are you doing this any way?

i was trying to make a textline and an image line up to look exactly the same in ie/moz. pretty simple stuff, but i couldnt make it work, so i resorted to the attribute selector to serve ie and moz with different values.

But i stripped down the markup and began again and i solved it with just some padding. It seems i forgot the KISS princip. but im back on track again.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

at the top of your document you are in fact in quirks mode in IE6.

Say what! is this true. What i have at the top is:


<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Is this making ie6 use quirks mode?

i have used M$ own reference site for doctype switching, and all xhtml-documents turns on standard-compliance mode. as far as i understand.

am i missing something?

Regards
Hafnius

7:42 pm on May 12, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hafnius,

that xml prologue thing (or whatever it's called) will cause IE6 to render differently than if it isn't there.

Never used it myself, as I believe I read on Tantek Celik site that it's pretty much useless anyway. I'm taking his word for it...

Anyway, google 'quirks mode' and there are some handy links..

8:46 pm on May 12, 2003 (gmt 0)

10+ Year Member



Hi all

I am very glad i found this out - it saves me alot of work and the xml thingy is gone now. i havent read about this any where so i am glad that you guys knew it.

Thanx, Hafnius

 

Featured Threads

Hot Threads This Week

Hot Threads This Month