what's wrong with this code

charlie

Hero Member

Posts: 822

what's wrong with this code

« on: August 05, 2010, 10:55:52 AM »

sorry .. kind of same as previous post but thought more likely to be seen here

basically .. want the link clicked to change and stay a colour while active.

Thought this would do it but doesn't

Quote

<a id="active" href="patientinfo.php">PATIENT INFORMATION</a>

and CSS as follows

Quote

#active {color:#0aff04;}

doesn't work though ... any ideas?

ta


	Logged

http://charliegrumples.hubpages.com/hub/Dylan-Carlson-Earth-Guitarist

Mr Anderson

DDN Contribs
Hero Member

Posts: 2209

Re: what's wrong with this code

« Reply #1 on: August 05, 2010, 11:07:10 AM »

a#active:active { }

Bearing in mind that an active state is the link state while it is being clicked.

Do you want it to be a set colour while on that page? If so, give that page's body tag an ID as well, and target the combo.


	Logged

500px | last.fm | G+

charlie

Hero Member

Posts: 822

Re: what's wrong with this code

« Reply #2 on: August 05, 2010, 11:17:44 AM »

mmm not sure I understand (hungover!)

But yes ... I have an 'include' menu for the patient info section (which has subsections). Once they click the 'treatment' section, a different 'include' menu will be included and whilst on those, I would like the colour to stay the same.


	Logged

http://charliegrumples.hubpages.com/hub/Dylan-Carlson-Earth-Guitarist

Mr Anderson

DDN Contribs
Hero Member

Posts: 2209

Re: what's wrong with this code

« Reply #3 on: August 05, 2010, 11:43:14 AM »

Give the body tag on each page an ID. Give each menu item an ID, eg: <body id="homepage"> and <li id="homelink"><a href="/" >Home</a></li>. Then style:

#homepage #homelink a { color: #0aff04; }

If you find that different link states are still changing then you have other CSS that needs to be overridden, eg:

#homepage #homelink a:link,
#homepage #homelink a:visited,
#homepage #homelink a:focus,
#homepage #homelink a:hover,
#homepage #homelink a:active { color: #0aff04; }


	Logged

500px | last.fm | G+

charlie

Hero Member

Posts: 822

Re: what's wrong with this code

« Reply #4 on: August 05, 2010, 12:05:11 PM »

Thanks ... have to pop out now .. will have a look in the morning ..

cheers smile


	Logged

http://charliegrumples.hubpages.com/hub/Dylan-Carlson-Earth-Guitarist

charlie

Hero Member

Posts: 822

Re: what's wrong with this code

« Reply #5 on: August 06, 2010, 01:08:48 PM »

mmmm am I doing something wrong .. nothing happening

I have

Quote

then in the menu code

Quote

<a id="patientinfolink" href="patientinfo.php">PATIENT INFORMATION</a>

and the css

Quote

#patientinfo #patientinfolink a:link,
#patientinfo #patientinfolink a:visited,
#patientinfo #patientinfolink a:focus,
#patientinfo #patientinfolink a:hover,
#patientinfo #patientinfolink a:active { color: #000000; }


	Logged

http://charliegrumples.hubpages.com/hub/Dylan-Carlson-Earth-Guitarist

Mr Anderson

DDN Contribs
Hero Member

Posts: 2209

Re: what's wrong with this code

« Reply #6 on: August 06, 2010, 01:48:53 PM »

Quote from: charlie on August 06, 2010, 01:08:48 PM

mmmm am I doing something wrong .. nothing happening

Your ID is on the anchor tag, but you're targeting your CSS at an anchor that is the child of the ID containing element.


	Logged

500px | last.fm | G+

charlie

Hero Member

Posts: 822

Re: what's wrong with this code

« Reply #7 on: August 06, 2010, 03:44:20 PM »

... not seeing what I'm doing differemtly to waht you suggested .... or maybe I'm missing something (like a few grey cells!)


	Logged

http://charliegrumples.hubpages.com/hub/Dylan-Carlson-Earth-Guitarist

Mr Anderson

DDN Contribs
Hero Member

Posts: 2209

Re: what's wrong with this code

« Reply #8 on: August 06, 2010, 03:57:47 PM »

Quote from: charlie on August 06, 2010, 03:44:20 PM

... not seeing what I'm doing differemtly to waht you suggested .... or maybe I'm missing something (like a few grey cells!)

In my example the ID is on the list item, on yours it's on the anchor. So instead of:

Code:

You need:

Code:

#patientinfo a#patientinfolink:link,
#patientinfo a#patientinfolink:visited,
#patientinfo a#patientinfolink:focus,
#patientinfo a#patientinfolink:hover,
#patientinfo a#patientinfolink:active { color: #000000; }


	Logged

500px | last.fm | G+

charlie

Hero Member

Posts: 822

Re: what's wrong with this code

« Reply #9 on: August 06, 2010, 04:32:46 PM »

Thanks for that .... need to get my head around 'why' but that's for another day ... it works a treat anyway so thank you for that ... client will be hoppy (I Hope !!) :-)

cheers again


	Logged

http://charliegrumples.hubpages.com/hub/Dylan-Carlson-Earth-Guitarist

sarahA

DDN Contribs
Hero Member

Posts: 2122

Re: what's wrong with this code

« Reply #10 on: August 06, 2010, 04:44:16 PM »

Because #patientinfolink is the id of the a attribute. You know if you have you'd use p#blah if you wanted to target specifically a paragraph with an ID of blah

Anyway, so <a id='patientinfolink' ..> needs to be targeted as a#patientinfolink

you read the selector from left to right so #patientinfolink a assumes that the anchor tag is contained within something that has an ID of patientinfolink.

What Mr A was trying to explain was instead of adding the ID to your anchor tag, add it to the list item. So if your nav is

Code:

Then you put the ID on the list item, and the id on the body tag, then you target it as per the example he gave.

- or have I just confused things even more? unsure


	Logged

Stuff By Me : Photos

charlie

Hero Member

Posts: 822

Re: what's wrong with this code

« Reply #11 on: August 06, 2010, 05:29:36 PM »

Lol .. I am a dumbass .... going to print this off and read it properly later when the more logical part of my brain is functioning :-)

ta


	Logged

http://charliegrumples.hubpages.com/hub/Dylan-Carlson-Earth-Guitarist

Pages: [1] Go Up

« previous next »