:last-child pseudo class selector in CSS and Internet Explorer -


i have following code:

ul.mylist li{      border-right: 1px dotted #000; } 

however, on last element, need remove border design working dictates last item not require border separator.

so, need target last child of list , within css have added

ul.mylist li:last-child{      border-right: none; } 

which know, works fine in firefox, safari , chrome.

the problem lies when view page in internet explore 6 through 8.

so, after digging around, found answer:

if browser ie<8, specify stylesheet this:

<!--[if lt ie 8]> <link rel="stylesheet" href="css/ie_all.css" type="text/css" /> <![endif]--> 

and within ie stylesheet specify following rules:

ul.mylist li{      border-right: expression(this.nextsibling==null?'none':'inherit'); } 

the nextsibling expression looks see if there element after , if there inherits rule specified in default stylesheet, if not applys new rule.

more information can found here


Comments

Popular posts from this blog

ruby - When to use an ORM (Sequel, Datamapper, AR, etc.) vs. pure SQL for querying -

php - PHPDoc: @return void necessary? -

c++ - Convert big endian to little endian when reading from a binary file -