XF 1.x How do you use EXTRA.css properly?

Blast

Registered
Hey everyone. This is one of the things that confuse me the most.

Let's say that a variable/class "sidebarPageOnline" exists. And has the following content:

Code:
sidebarPageOnline {
color: #x;
font-weight: x;
element: x;
margin: x;
}
And apparently, on a different page, the style used the same variable/class again. But this time, I want to edit it that it will only reflect in that page alone, how can I do that? Let's say the page name is Rules. How can I make a new sidebarPageOnline that only shows up in the Rules page?
 

Blast

Registered
I'm kinda stuck. So, apparently, a:link, a:visited is the class that is used in the username in WF's Profile Post, also, it's the same class that is used in the discussion view for threads. Now, if I put font-weight: normal(so that when a thread is visited/read, the weight goes to normal instead of bold), the username in the Profile Post would also be normal. How can I make it so that I can have a a:link, a:visited that is exclusive to the discussion view and the Profile Post widget?
 

Steve

Pixel Exit Staff
You need to find a specific class for each page, using the inspect tool found in most browsers (F12).

Take this page we're viewing now. You should see a body class or a content template class.
upload_2016-3-12_14-55-46.png


So something like below would only work on pages with the thread_view class.
Code:
.thread_view .sidebarPageOnline {
color: #x;
font-weight: x;
element: x;
margin: x;
}
 

Pre-Sale Questions

If you have any questions or concerns you want to ask before you make a purchase don't hesitate to use one of our multiple support channels for your convenience.