Click to See Complete Forum and Search --> : Links / Iframes


Jack2003
09-07-2003, 11:24 AM
Hi,

A have developed a webpage in dreamweaver-mx. This page contains 2 iframes.
In each frame a different html-page is beeing displayed. I defined a css sheet with the following propperties:

a:link {color: #000000; text-decoration: none; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px;}
a:visited {color: #000000; text-decoration: none; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px;}
a:active {color: #FF0000; font-weight : bold; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px;}
a:hover {color: #FF0000; font-weight : bold; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px;}

When I click on a link in the first frame this link is displayd red (#FF0000) but when I click on a link in the second frame the selected link in the first frame is reset to the default clour black (#000000).

What should I do to keep the selected link in the first frame the colour red (#FF0000) when I click on a link in the second frame.
To use the property 'visited' is not good because then all the selected links will turn red as the are activated in the past.

I hope my question is not confusing.

Thanks in advance,
Jack

mzanimephp
09-08-2003, 03:00 PM
No, not at all.

I assume the (first) frame on the left is for navigation or something correct? To make them appear always as red I would suggest that you make a new pseudo class.

Currently you have this:


a:link {color: #000000; text-decoration: none; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px;}
a:visited {color: #000000; text-decoration: none; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px;}
a:active {color: #FF0000; font-weight : bold; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px;}
a:hover {color: #FF0000; font-weight : bold; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px;}


You might want to modify this though, because it isn't all that great to put your font speicifications inside your pseudo selectors.

Try this...



/* define default fonts for every block-level element up here */

td, th, tr, p, div, ol, li, ul, dt, dd {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
}

/* Then define your pseudo selectors seperately here. */
/* They will inherit the same font's if enclosed in a block level element like <p> or <td> */

a:link { color: #000000; text-decoration: none; }
a:visited { color: #000000; text-decoration: none; }
a:active { color: #FF0000; text-decoration: underline; }
a:hover { color: #FF0000; text-decoration: underline; }

/* Now for your links on the left (first frame) we create a custom pseudo selector class, calling it "nav" */

.nav:link { color: #FF0000; text-decoration: none; }
.nav:visited { color: #FF0000; text-decoration: none; }
.nav:active { color: #FF0000; text-decoration: underline; }
.nav:hover { color: #FF0000; text-decoration: underline; }


If your calling to all of your pages via a single CSS file, then you must use <a href="whatever.htm" class="nav"> for the links in the first frame to always appear red.

Hope this helps.

-Mike.