Solved

Conditional formatting in CSS???

Posted on 2007-03-21
5
2,330 Views
Last Modified: 2012-06-27
Does anyone know if it is possible to implement conditional formatting in CSS?

I have a HTML table of numeric data generated by an ASP script. If a number is a negative value I want it to appear in red, otherwise black. I can do this easily in ASP, but would like to do it in CSS (if it’s possible) to keep the style completely separate from the ASP page.

Any insights are much appreciated.

Many Thanks
0
Comment
Question by:inghfs
  • 2
  • 2
5 Comments
 
LVL 30

Expert Comment

by:VirusMinus
ID: 18763021
CSS cannot read the content on your page and decide to format it based on criteria like that.

CSS is applied client side *after* your page has already been generated server side by the ASP.

the way i would do it is, in ASP while looping to draw the table rows and cells, check if the number is negative and then draw the cell containing the negative number with a class.

eg.

<%
loop .. criteria..
...
...
if number < 0 then
response.write "<td class=""negative"">" & number & "</td>"
else
response.write "<td>" & number & "</td>"
end if
...
...
end loop
%>

Now in your CSS, define this class as follows:

.negative{color:red;}
0
 

Author Comment

by:inghfs
ID: 18763152
Yes this is the way I did it, just wanted to verify there wasn’t an easier way on the CSS side.

Many Thanks for the help.
0
 
LVL 30

Accepted Solution

by:
VirusMinus earned 500 total points
ID: 18763284
you're welcome :) just one thing though..i see you're fairly new here, and may not understand the grading system clearly.

just coz something can't be done, or someone confirms what you already knew, or proves that what you thought of already is the best way, it doesn't mean you grade a B or a C. You're grading history is looking pretty scary with Bs and Cs.

Giving a higher grade does not cost you any extra points, but reflects on us experts capability to provide quality answers. and also that you value our voluntary time in helping others.

Experts view your grading history often and if they see a lot of B's and C's, they would be hesitant in helping you.

I recommend reading the grading guidelines to help you grade fairly. http://www.experts-exchange.com/help.jsp#hi55

quote :
"Grading at Experts Exchange is not like school. It's more like the "10-point Must" system in professional boxing; in other words, an answer is worth an A, unless it doesn't resolve your issue. If it requires you to do a little more research, or figure out one more piece of code, then it's worth a B. If you think it's not worth a B, the custom is to offer the Experts an opportunity to earn a better grade."

And if you ever wish to change any grade you've awarded incorrectly or by mistake, just post a 0 point question in Community Support Zone requesting so with a link to the question.
0
 

Author Comment

by:inghfs
ID: 18764054
Appreciate the advice; I have posted the amendment in the Community Support Zone.

Many Thanks
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…

708 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

12 Experts available now in Live!

Get 1:1 Help Now