AnsweredAssumed Answered

Custom CSS best practices

Question asked by Aaron Bahmer on Jan 3, 2018
Latest reply on Apr 25, 2018 by rogrant@nmsu.edu

I want to upload custom CSS to our instance/theme and wondered if anyone has any suggestions for best practice in terms of naming conventions for classes and IDs. I want my faculty to be able to easily activate the special styles, so thought an overarching DIV class, then any desired tag styles would be identified as a child to that class.

Example:

DIV.ewc { } (yes, empty)

DIV.ewc H2 { styled }

DIV.ewc H3 { styled }

This way, faculty just need to create the <div class="ewc"> pair of tags around their content to "turn on" the special styles and not have to worry about or remember to class each affected tag.

 

What about IDs? Should I name them with my "ewc" moniker or include them in the child classes? I'm supposing adding the moniker is better, since I might run amuk with an existing ID style which we may not wish to apply if the main DIV class is not present.

#ewc_header   vs

DIV.ewc #header

 

Thoughts?

Outcomes