Solved

W3C Validator does not like this line in stylesheet

Posted on 2011-03-07
2
317 Views
Last Modified: 2012-05-11
Hi!

The W3C validator does not like this line in stylesheet
ul.dropdown li:last-child a{border-right:none;}
It says "Unknown pseudo-element or pseudo-class :last-child"
Any specific code modification would be appreciated.

0
Comment
Question by:TrueBlue
2 Comments
 
LVL 30

Assisted Solution

by:LZ1
LZ1 earned 50 total points
ID: 35059923
The pseudo code :last-child is not valid in the CSS 2.1 spec.  If you change to validate in CSS 3 it should pass.

Work around: You can class the last LI in your code and then apply your CSS that way
0
 
LVL 14

Accepted Solution

by:
Designbyonyx earned 75 total points
ID: 35060365
LZ1 is right.  You really need to use a class name, as the :last-child pseudo class is part of CSS3, which is not supported by any current version of IE, and it will be another 2 years beofre IE9 has wide enough market share.

So your code would look like this:

<ul class="dropdown">
  <li><a href="#">Link 1</a></li>
  <li><a href="#">Link 1</a></li>
  <li><a href="#">Link 1</a></li>
  <li class="last"><a href="#">Link 1</a></li>
</ul>

Open in new window


If for whatever reason you can't edit the code of the menu, then you can use javascript... in this example I am using jQuery:

$('ul.dropdown li:last').addClass('last');

Open in new window


And your CSS like this:

ul.dropdown li.last a{ border-right:none; }

Open in new window

0

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
This article discusses four methods for overlaying images in a container on a web page
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…

705 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now