Solved

Overruling shortcuts, how to set specificity to overrule ALL?

Posted on 2008-10-06
4
349 Views
Last Modified: 2012-05-05
I have some shortcuts I use a lot in my html pages.  Here are 2 exampleis:
.fL { float: left; }
.fR { float: right; }

The problem is that these only have specificity of 020, but I want them to overrule everything.

For example, I have a nice blockquote like this:
.contentpaneopen blockquote { float:right; }

And, because of the lower specificity, this code:
<blockquote class="fL">
gets floated right.

How can I solve this without a css sheet that would become something like this:
.fL, .contentpaneopen .fL, .otherclass .fL, #otherid .fL, #anotherid .fL, #andanotherid #insideanother .fL { float: left; }
(and so on).
0
Comment
Question by:R-U-Bn
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 3

Accepted Solution

by:
Mr_Splash earned 35 total points
ID: 22650631
The only way I can think to do this would be to give your blockquote a class that gives it the float right. i.e.

.contentpaneopen blockquote.className { float:right; }

So in your HTML all your block quotes look like
<blockquote class="className">

Then for the ones you need to float left the HTML would look like this
<blockquote class="className FL">
0
 
LVL 3

Expert Comment

by:Mr_Splash
ID: 22650675
Better yet, add this below the link to your stylesheet;

<style type="text/css">
  .fL, .contentpaneopen .fL, .otherclass .fL, #otherid .fL, #anotherid .fL, #andanotherid #insideanother .fL { float: left; }
</style>
0
 
LVL 2

Author Comment

by:R-U-Bn
ID: 22651338
Mr. Splash, your first solution is what I was thinking of as a last fall back solution.
Your second is exactly what I do not want.  With this I mean that the code you copied from me was just a bad example.  It would become full of id's and classes (actually all the ones that exist in my css).

If you don't mind, I will wait a while for possibly more solutions until I accept your first answer as a sort of confirmation that it is not possible what I want.  ( If this is rude or impolite on this site, please tell me how to ask for more opinions).

So, does any has any other opinons?
0
 
LVL 2

Author Closing Comment

by:R-U-Bn
ID: 31503441
I guess that wás the only option.  Maybe once a css protocol version will allow to SET the specificity, something like:  .fL (101) {  ..  }   :-))  (because I think there are situations where it would be usefull and efficient).
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer…
This article discusses four methods for overlaying images in a container on a web page
In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

734 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