CSS/HTML Help

[Bob Schroeck]

Yeah, I'm still working on the prototype for the new website look. They're almost ready for prime-time, except I have two questions that I'm hoping someone here can answer.

The first is a CSS question: I want to set the link colors for a style -- specifically the style that does the white text for my copyright notice, so any embedded links in the notice don't do the blue/red thing on the dark green background. I've tried a bunch of things that I found in my research that looked right, but turned out not to be. The style is currently:

/* Define a class for the copyright notice. */
p.copyright {
vertical-align:bottom;
}

Now I've tried

linkcolor:#fff;
vlinkcolor:#fff;

in there but it hasn't worked. Can anyone point me in the right direction?

Question two is a (D)HTML query. I want to put a simple Amazon.com search box in the same sidebar. The code from Amazon is very simple:

http://rcm.amazon.com/e/cm?t=accessdeni ... =qs1&f=ifr

but nothing comes from this. I've tested the src URL by plugging it directly into a browser and gotten the search box, so it's not a broken link. Can anyone give me a clue what might be going on here?

Thanks!
-- Bob
---------
Then the horns kicked in...
...and my shoes began to squeak.

[bmull]

Now I've tried

linkcolor:#fff;

vlinkcolor:#fff;

These have been depreciated so I'd recommend you use the pseudo classes :link and :visited instead. Also, looking at the code, which links do you want to "fix" the color? The only "copyright" classes I can find don't have links in them to change.

[Bob Schroeck]

I'd recommend you use the pseudo classes :link and :visited

How does that work? I haven't quite grokked the usage of pseudoclasses yet. Where I'm using them, I've basically copied from other sources.

Also, looking at the code, which links do you want to "fix" the color? The only "copyright" classes I can find don't have links in them to change.

That's because none of the pages up in test have them yet -- I was working on the "My Books" and "My Worlds" pages, and wanted to put links to SJ Games on the relevant copyright text. When I viewed the in-progress pages locally, I realized I had a color problem.
-- Bob
---------
Then the horns kicked in...
...and my shoes began to squeak.

[Sweno]

This should get you different coloration for copyright class links, and visited copyright class links.

.copyright:link { color: #976907; }

.copyright:visited {color: #B75905; }

If you want to get fancy you can also do a hover:

.copyright??hover { color: #FFA509; }

This way you can simply call your copyright class in the or and any included links inherit the proper coloring.
-Terry
-----
"so listen up boy, or pornography starring your mother will be the second worst thing to happen to you today"
TF2: Spy

[bmull]

Bob (and sweno),
 

.copyright:link { color: #976907; }

.copyright:visited {color: #B75905; }

I don't think this will work as written.  I believe that you'd need the a:link selector in order for it to work properly.
Using Bob's css from the sample page:
/* Define a class for the copyright notice. */
p.copyright {
  vertical-align:bottom;
}
.copyright a:link {color: #fff}
.copyright a:visited {color: #fff}
will give the unvisited link and visited link the color (white in this case.)

Basically all you are doing here is creating a contextual selector (think of it as a "chained" list of selectors.)  It says that for any selector of the type 'a' within any selector with the class .copyright look at the :link and :visited pseudo-classes and apply the selected property.
This site might be a little clearer:  http://htmlhelp.com/reference/css/structure.html
Remember, if you do use the :hover option that it goes AFTER the :link
and :visited or it will not work correctly in some browsers.
Keith

[Sweno]

hmm, well it works as I would expect in firefox and safari. A the pseudo elements should only apply to those objects that have that property.

:link and :visited only apply to s.

:hover can apply to almost any object, which is why it would need to be chained with :link, otherwise the whole text area would change color on mouseover (this
may be desired in some cases).

I wasn't able to test in IE though. And I expect that being as explicit as possible would help to cut down on rendering bugs.
-Terry
-----
"so listen up boy, or pornography starring your mother will be the second worst thing to happen to you today"
TF2: Spy

[Bob Schroeck]

Yeah, that does what I want -- and I've checked it in IE7 just now. Oddly, it seems to disable underlining the link, so I have to track that down and add
it in.

Thank you!

Now can anyone give me a clue why the IFRAME thing isn't working?
-- Bob
---------
Then the horns kicked in...
...and my shoes began to squeak.

[robkelk]

Oddly, it seems to disable underlining the link, so I have to track that down and add it in.

Add text-decoration:underline to the style - that turns on underlining for any text.

You might find the official http://www.w3.org/Style/CSS/learning site useful, depending on how well you can read technical jargon...

 
--
Rob Kelk
"Governments have no right to question the loyalty of those who oppose
them. Adversaries remain citizens of the same state, common subjects of
the same sovereign, servants of the same law."

- Michael Ignatieff, addressing Stanford University in 2012

[Bob Schroeck]

Ah... Thanks, Rob. I see exactly what's going on in the stylesheet -- I have underlining shut off globally for links. I'll have to turn it back on,
either for the entire page, or locally.
-- Bob
---------
Then the horns kicked in...
...and my shoes began to squeak.

[bmull]

Bob Schroeck wrote:

---

Question two is a (D)HTML query. I want to put a simple Amazon.com search box in the same sidebar. The code from Amazon is very simple:









but nothing comes from this. I've tested the src URL by plugging it directly into a browser and gotten the search box, so it's not a broken link. Can
anyone give me a clue what might be going on here?

Bob,

Looking at your code you have an iframe that uses the XML feed and a, commented out, script that uses the widgets access. Which one do you want to use or
does it matter?

Doing some trials with the URI it appears that when it is included in an iframe the returned information is blank and the iframe is not displayed. Only when
the URI is placed, as you state above, directly in the browser location bar does the search box appear. No matter what I tried I was unable to get anything
but a blank page. Here is what the site returns when using the iframe:

The page returned when the URI is directly entered into the location bar is a complete page (the search box you see.) I'll have to do some more
checking once my cable modem stops locking up all the time.
Keith

P.S. I have come to hate the yuku editing box. The amount of editing I had to do just to get this message to look as bad as it does was ridiculous.

[Bob Schroeck]

I should note that I still want to put that Amazon search box on the top page, but I still can't make it -- or about 3/4 of Amazon's widgets -- work at
all. Any clues would be appreciated.
-- Bob
---------
Then the horns kicked in...
...and my shoes began to squeak.

[bmull]

Bob,

Have you tried generating the link using the widget creator? http://widgets.amazon.com/Amazon-Search-Widget/

Keith

[Bob Schroeck]

Oh, yeah. Nothing works.

But when I get home tonight I'll give it another shot, just to make sure.
-- Bob
---------
Then the horns kicked in...
...and my shoes began to squeak.