Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Question about selectors...

Reply
Thread Tools

Question about selectors...

 
 
rbaulbin@hotmail.com
Guest
Posts: n/a
 
      02-07-2008
Hello -

Question for anyone. With the following CSS:

..menu a:active
{
background-color: #F6D566;
color: #CC00CC;
}


Why won't this HTML work:

<a class="menu" href="#wherever"> This is a paragraph.</a>

But this does:

<div class="menu">
<a class="menu" href="#wherever"> This is a paragraph.</a>
</div>

Why does it need the div? If you write the CSS as a.menu:active
or .menu:active, it works.
 
Reply With Quote
 
 
 
 
Nik Coughlin
Guest
Posts: n/a
 
      02-07-2008
<(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> Hello -
>
> Question for anyone. With the following CSS:
>
> .menu a:active
> {
> background-color: #F6D566;
> color: #CC00CC;
> }
>
>
> Why won't this HTML work:
>
> <a class="menu" href="#wherever"> This is a paragraph.</a>


Because the CSS means apply this style to an a:active which is a child of
menu.

> But this does:
>
> <div class="menu">
> <a class="menu" href="#wherever"> This is a paragraph.</a>
> </div>
>
> Why does it need the div? If you write the CSS as a.menu:active
> or .menu:active, it works.


 
Reply With Quote
 
 
 
 
Michael Fesser
Guest
Posts: n/a
 
      02-07-2008
..oO((E-Mail Removed))

>Question for anyone. With the following CSS:
>
>.menu a:active
>{
> background-color: #F6D566;
> color: #CC00CC;
>}
>
>
>Why won't this HTML work:
>
><a class="menu" href="#wherever"> This is a paragraph.</a>
>
>But this does:
>
><div class="menu">
><a class="menu" href="#wherever"> This is a paragraph.</a>
></div>
>
>Why does it need the div?


Because you defined it like that in your selector.

>If you write the CSS as a.menu:active
>or .menu:active, it works.


From <http://gallery.theopalgroup.com/selectoracle/>:

..menu a:active

| Selects any a element which is in a state of activation that is a
| descendant of any element with a class attribute that contains the
| word menu.

a.menu:active

| Selects any a element with a class attribute that contains the word
| menu and which is in a state of activation.

Micha
 
Reply With Quote
 
Harlan Messinger
Guest
Posts: n/a
 
      02-08-2008
http://www.velocityreviews.com/forums/(E-Mail Removed) wrote:
> Hello -
>
> Question for anyone. With the following CSS:
>
> .menu a:active
> {
> background-color: #F6D566;
> color: #CC00CC;
> }
>
>
> Why won't this HTML work:
>
> <a class="menu" href="#wherever"> This is a paragraph.</a>
>
> But this does:
>
> <div class="menu">
> <a class="menu" href="#wherever"> This is a paragraph.</a>
> </div>
>
> Why does it need the div? If you write the CSS as a.menu:active
> or .menu:active, it works.


Right. Because "a.menu:active" (an activated anchor of class "menu")
means "match activated anchors of class 'menu'" and ".menu a:active"
doesn't mean that. (It means match activated anchors that are inside
something [there's no reason why it has to be a div] of class "menu".)
 
Reply With Quote
 
Jukka K. Korpela
Guest
Posts: n/a
 
      02-08-2008
Scripsit (E-Mail Removed):

> Hello -
>
> Question for anyone.


Please get to the point.

> .menu a:active
> {
> background-color: #F6D566;
> color: #CC00CC;
> }


The selector :active is interpreted differently by different browsers.
This is the interesting issue and perhaps worth discussing. The rest is
more or less very elementary CSS, which you should learn from a good
tutorial. Tutorials are generally better at explaining elementary things
than casual Usenet messages are.

> Why won't this HTML work:
>
> <a class="menu" href="#wherever"> This is a paragraph.</a>


It does, for some values of "work". But you style sheet snippet has no
effect on its rendering, of course, since .menu a:active matches only an
<a> element in active state (whatever _that_ is) nested inside an
element in class "menu".

But if it makes a meaningful link, it's not a paragraph.

> But this does:
>
> <div class="menu">
> <a class="menu" href="#wherever"> This is a paragraph.</a>
> </div>
>
> Why does it need the div?


It doesn't "need" a div. It's a simple matter of the meaning of
selectors.

> If you write the CSS as a.menu:active
> or .menu:active, it works.


"Doctor, if I do _this_, I feel better."
"Then do so."

If you want the effect to take place both for links that are in class
"menu" and for links inside an element in class "menu", you can simply
write

a.menu:active, .menu a:active
{
background-color: #F6D566;
color: #CC00CC;
}


--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

 
Reply With Quote
 
Ben C
Guest
Posts: n/a
 
      02-08-2008
On 2008-02-07, Nik Coughlin <(E-Mail Removed)> wrote:
><(E-Mail Removed)> wrote in message
> news:(E-Mail Removed)...
>> Hello -
>>
>> Question for anyone. With the following CSS:
>>
>> .menu a:active
>> {
>> background-color: #F6D566;
>> color: #CC00CC;
>> }
>>
>>
>> Why won't this HTML work:
>>
>> <a class="menu" href="#wherever"> This is a paragraph.</a>

>
> Because the CSS means apply this style to an a:active which is a child of
> menu.


Descendent, not child.
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
question row filter (more of sql query question) =?Utf-8?B?YW5kcmV3MDA3?= ASP .Net 2 10-06-2005 01:07 PM
Quick Question - Newby Question =?Utf-8?B?UnlhbiBTbWl0aA==?= ASP .Net 4 02-16-2005 11:59 AM
Question on Transcender Question :-) eddiec MCSE 6 05-20-2004 06:59 AM
Question re: features of the 831 router (also a 924 question) Wayne Cisco 0 03-02-2004 07:57 PM
Syntax Question - Novice Question sean ASP .Net 1 10-20-2003 12:18 PM



Advertisments