XF 1.5 How to override/ignore CSS?

Not open for further replies.


Well-known member
I think this is a pretty simple question but I could do with some help.

I've included some bootstrap javascript inside an XF2 widget and included the bootstrap css:

Part of this is

body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
  background-color: #fff;

which is overiding my body background colour and image as set in the XF style.

Is there any way to make it ignore this and leave it as it was?


Well-known member
Use !important if you want your CSS to be the "alpha male," so to speak.

That didn't seem to work (and I thought was bad practice).

Even sticking the bootstrap css in the header above where the XF css is linked didn't seem to let the XF one take priority.

A solution is just to copy the bootstrap stuff I want into extra.less but it'd still be good to know how to set a priority in something like this.


XenForo moderator
Staff member
You mention this is for XF2 and using extra.less - this site is not yet ready for XF2 related questions so you should ask them on the demo site.
Not open for further replies.