I want to apply the rules in a CSS file to a certain div/class so, for example, the contents of events.css is only applied to the contents of a class called .events and not outside this scope without the need to add the class .events to the start of each css rule.
I am thinking this is not possible though - but you never know.
If not I am thinking of achieving the same effect by prefixing the .events to the CSS rules after they have been uploaded/edited. I am thinking this should be fairly trouble-free, but does anyone forsee any problems?
I am thinking this is not possible though
Indeed. Unless you put the content in question in an iframe. Then you get a whole separate document to style differently.
I am thinking of achieving the same effect by prefixing the .events to the CSS rules after they have been uploaded/edited. I am thinking this should be fairly trouble-free, but does anyone forsee any problems?
In an automated fashion? You would need to be able to parse the CSS input to determine where the beginnings of the selectors were.
This is not as trivial as you might think to do correctly:
/* This is my grate CSS
.sausage { color: red; } adds a class rule
/*/ .eggs, .bacon { color: red; }
.potato:before { content: "; }
.beans { content: "; }
is an example of tricky-to-parse CSS. .eggs
, .bacon
and .potato
begin selectors and would want a .events
prefix. .sausage
and .beans
are not.