[Last Call] Learn how to a build a cloud-first strategyRegister Now


Css Div

Posted on 2012-09-15
Medium Priority
Last Modified: 2012-09-15
When in this case "panel" in the css  style comes before a:hover and a:visited:hover, it mean that is a format for only what is inside the div "panel"?

<div class="panel">
          <h3>Sliding Panel</h3>
          <p>Here's our sliding panel/drawer made using jQuery with the toggle function and some CSS3 for the rounded corners</p>

.panel a:hover, .panel a:visited:hover
margin: 0;
padding: 0;
color: #ffffff;
text-decoration: none;
border-bottom: 1px solid #ffffff;
Question by:rflorencio
  • 2
LVL 27

Expert Comment

ID: 38401422
no. this css selector applies to all hovered links in all elements that have the panel class wether visited or not

look for "css selectors" in google, and preferably use the W3C site
LVL 38

Accepted Solution

Tom Beck earned 1000 total points
ID: 38401534
The answer is yes. Only the anchors that are inside the element with class="panel" are affected. Of course, the syntax you presented in your post will not work. It should be:

.panel a:hover, .panel a:visited:hover {
margin: 0;
padding: 0;
color: #ffffff;
text-decoration: none;
border-bottom: 1px solid #ffffff;

Maybe that's just a typo on the post however.
LVL 27

Assisted Solution

skullnobrains earned 1000 total points
ID: 38401814
yup, i kinda misread the question so the answer was yes indeed
nice catch for the "{" as well

to make it clear, the css does apply to what was stated above.

here is a small quick-and-dirty reference

, are used as separators between alternative selectors
_ (spaces) are used to symbolize that the element at their right should be nested somewhere under the element at the left
> is the same but the element at the right should be a direct child of the element et the left

something selects all elements named something
.something  selects all elements that have the something class
#something selects the element that has the something id
you can use combinations such as div.myclass

happy coding

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

This article discusses how to create an extensible mechanism for linked drop downs.
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
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…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
Suggested Courses

825 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