CSS Class Names and proper identification

Posted on 2012-04-11
Medium Priority
Last Modified: 2012-04-30
Hi -

We have a website where the HTML is being generated from the CMS system.  As such - the class names for various parts are predictable.

For example - we have a menu where the menu options are along the lines of:

<li class="leaf">
<a href="#">First menu item</a>
<li class="leaf">
<a href="#">Second menu item</a>
<li class="leaf last">
<a href="#">Last menu item</a>

What would the CSS line be to identify anything with "leaf" and "a"?

Sort of a generic..

.leaf a { }

Question by:erzoolander
  • 2
LVL 30

Expert Comment

ID: 37832930
That would work.

You could also do li.leaf a{}

Author Comment

ID: 37833001
And that would cover the "leaf last" classname as well?
LVL 30

Accepted Solution

LZ1 earned 2000 total points
ID: 37833006
If you want to do both leaf and last classes then do this:

li.leaf.last a{}

Open in new window


Featured Post

Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
Without even knowing it, most of us are using web applications on a daily basis.  In fact, Gmail and Yahoo email, Twitter, Facebook, and eBay are used by most of us daily—and they are web applications. We generally confuse these web applications to…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
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…

622 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