Solved

css redefinition question

Posted on 2004-09-29
5
384 Views
Last Modified: 2013-12-03
This is a 2 part question.
First, how can I or can I set a color and then use that throught my style sheet, something like:

defcolor=#990000

<style>
.css1 {color:defcolor}
.css2 {background-color:defcolor}
.
.
</style>

so I do not have to track down this color everywhere if I want to change it.

Question 2
How can I set one style equal to another?

<style>
.css1 {
color:red;
font-size:12;
padding:2;
}
.css2 {
(.css2=.css1)
background-color:blue;
text-align:right;
}
.
.
</style>

I know I can put the css2 in the first section also, but that does not accomplish how I want to manage my styles.

Thanks, Troy
0
Comment
Question by:troyd1
5 Comments
 
LVL 5

Assisted Solution

by:php-webdesign
php-webdesign earned 200 total points
ID: 12180134
question 1:

http://www.kryogenix.org/days/2003/07/23/variables

question 2:

.style1, .style2 { margin:0; padding:1em;color:blue; ... }
or
div.style1, #style2 p, .style3 a:hover { color:blue; ... }

That will apply the styles to both/all. To add extra styles beyond the common ones you would add another style declaration:

.style2 { border: 5px green double; }
0
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 300 total points
ID: 12182321
You should handle the first one on the server side during generation.  Otherwise you will have to use scripting whenever you want to use it.  Using variables is really counter to the whole CSS concept of using inheritance to cascade down through the DOM.

For the second you you need to modify the style rule on the fly with scripting.  Or you can wait to see if browser manufactures support a larger subset of CSS3 then they have with CSS2.  You still won't get variables, but behaviours/imbeded script might be there, if they can figure out how to do it securely.

If you want scripting for part 2, let me know and I will post something.

Cd&
0
 
LVL 18

Expert Comment

by:arantius
ID: 12182851
1: Variables are beyond the scope of CSS.  Doesn't your editor have a Search/Replace All functionality?

2: If you want 2 elements to share a lot of common traits, and differ in a few ways:

.css1, .css2 {
color:red;
font-size:12;
padding:2;
}
.css2 {
background-color:blue;
text-align:right;
}

This is the "Cascading" part of "Cascading Style Sheets" .  The styles you define cascade down until they are overwritten.  Both by one element containing another, or one rule following another.
The first rule there applies styles to .css1 and .css2, the second applies some different ones to just .css2 .
0
 

Author Comment

by:troyd1
ID: 12184415
Ok, the first question is not supported, I do not think the second is either, but here is what I am trying to do:

<style>
.b10 {
 font-size:12;
 font-color:#000000;
 font-weight:bold;
}
.b10u {
 style=.b10;
 text-decoration:underline;
)
.b10uc {
 style=.b10u;
 text-align:center;
)
.b10ur {
 style=.b10u;
 text-align:right;
)

I know I could have done it like this:

<style>
.b10,.b10u,.b10uc,.b10ur {
 font-size:12;
 font-color:#000000;
 font-weight:bold;
}
.b10u {
 text-decoration:underline;
)
.b10uc {
 text-align:center;
)
.b10ur {
 text-align:right;
)

but I have a good style sheet application that is very extensive if the other is possible.

Thanks, Troy
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 12184733
As I said earlier.  It cannot be done with straight CSS.  You have to use scripting at load time to generate additional properties for the rules using the existing rule as the source.  If you want to go a scripting route let me know and I will script it.  I don't believe there is going to be a non-scripted solution.

Cd&
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
jQuery CSS Scroll Issue 3 72
Adding a hidden div to each row in a table 6 61
Centering a nested div 16 58
WordPress Themes 10 34
I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

910 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

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now