[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

simple css problem

Posted on 2004-11-27
7
Medium Priority
?
645 Views
Last Modified: 2012-05-05
This is a simple css class that I wish to apply on text, now the problem is that the text contains Links too and I want to change link color, font etc.
.quote {
      font-family: Verdana;
      font-size: 9pt;
      font-style: normal;
      line-height: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      color: #000000;
}
.quote:link {
color:#3333ff; text-decoration:none;font-size: 11pt;
}
.quote:visited {
color:#66666; text-decoration:none;
}
.quote:active {
color:#FF0033; text-decoration:underline;
}
.quote:hover {
color:#3333ff; text-decoration:underline;
}
The class is working well for simple text but when links come it doesn't apply the code for this(like for hover, visited and link).
0
Comment
Question by:jimmy282
  • 2
  • 2
5 Comments
 
LVL 31

Expert Comment

by:seanpowell
ID: 12685809
Like this:

.quote a:visited { color:#66666; text-decoration:none; }

with

<p class="quote"><a href="#">text</a></p>

Let me know if you need more detail, okay?

Thanks,
Sean
0
 
LVL 49

Expert Comment

by:Roonaan
ID: 12689868
In the current setup you could try using:
<p class="quote">text <a href="#" class="quote">link</a> text</p>

But the solution provided by seanpowell has some better semantics.

-r-
0
 
LVL 11

Author Comment

by:jimmy282
ID: 12694673
my problem is this.
I already have text in about 200 pages/
something like this.
<A class="" href="something.htm"><SPAN
class=quote>text here</SPAN></A>

now how do I apply my "quote" class to these SPAN's inside the <a> tag. please help.
0
 
LVL 11

Author Comment

by:jimmy282
ID: 12694680
I dont want to change the HTML at all. I can only make changes to the css. but what changes?
0
 
LVL 49

Accepted Solution

by:
Roonaan earned 200 total points
ID: 12694718
a:link span.quote {some definitions}
a:visited span.quote {some definitions}
a:active span.quote {some definitions}
a:hover span.quote {some definitions}
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

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

Creating a CSS block that only applies to printing By default, all of your CSS applies to every possible view of your page - whether on screen, printed, landscape, touch-screen, or whatever.  You can, however, add CSS that only applies under certai…
This article discusses four methods for overlaying images in a container on a web page
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses
Course of the Month20 days, 8 hours left to enroll

868 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