XF 1.2 Xenforo syntax to inherit built-in css class already declared or styled using style properties?

rdn

Well-known member
Like I want to create a new css class but want to inherit some a built-in class.

Code:
.CustomCssClassHere{
@sectionHeaders
/* my custom css goes here */
}
Is it possible?
 

MagnusB

Well-known member
I don't understand what you want to do? Normally, you would just use the original class, then add another custom class and use the custom class to whatever custom css you want to add.
 

rdn

Well-known member
Let say I have a custom html template.

Code:
<div style="CustomCssClassHere">
Custom Content
</div>
But I want to use the properties of the built-in xenforo class .sectionHeaders
and add some of my custom css style.

Can I do that?
Just like xenforo template, if you include it.
Code:
<xen:include template="ExistingTemplate" />
 

MagnusB

Well-known member
Just use the class, if it doesn't work, try to include the css file with the class you want to include. Think sectionHeaders is one that is included on most pages though.
 

rdn

Well-known member
I got what you mean, so I change my html code to.
Code:
<div style="CustomCssClassHere sectionHeader">
Custom Content
</div>
:)
 

MagnusB

Well-known member
If you want a protip; If you want something to apply to only CustomCssClassHere along with sectionHeader, use:
Code:
.CustomCssClassHere.sectionHeader {}
I usually make a sport out of not using !important with CSS, as they can create unforeseen complications when you depend on inheritance.
 
Reactions: rdn

rdn

Well-known member
If you want a protip; If you want something to apply to only CustomCssClassHere along with sectionHeader, use:
Code:
.CustomCssClassHere.sectionHeader {}
I usually make a sport out of not using !important with CSS, as they can create unforeseen complications when you depend on inheritance.
Thanks for the tips.i will try that later on my desktop.
 
Top