: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
Post a Comment