Solved

W3C Validator does not like this line in stylesheet

Posted on 2011-03-07
2
332 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

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer …
This article discusses four methods for overlaying images in a container on a web page
In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

867 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

13 Experts available now in Live!

Get 1:1 Help Now