hi all,

i'm trying to make quest page more readable by customcssing this class "ui message" but i cant figure out how to target that class specifically without affecting other pages. i tried using this: .ui, .message {color: !important;} but this is affecting other area such as quickstock page too.

i can use: .message {color: !important;} but my concern is i might changing other place i dont want to change.

so is there a way to target "ui message" alone?

Have you tried

[Code].ui .message {color: !important;}[/code]

I'm not sure what you want is feasible, because a lot of pages are missing labels that would make them easy to target without also affecting other areas of the site, as you already discovered.

If there's a more specific label somewhere, it would help tremendously.

I can't help right now because I'm on mobile, but I might be able to look into it tomorrow. What exactly are you trying to do? You can smail me if you don't want to go into detail here. :)

thanks

yeah i tried .ui .message without the comma but that doesnt work. it just went back to default color.

specifically, on all quest pages. in the gray box between "'s quest" and "start quest" button, i want to change the font color. which is working right now, but my current code is affecting other area i might guess. i am looking for code that only will affect "ui message" class, without affecting "ui" or "message" class. if that is possible :)

To get that to work you also need to get rid of the space so it looks like the below .ui.message { color: !important; } but this will still affect other pages that have those two classes as well

so something else needs to narrow it down, the below narrows it down, I've been checking around haven't seen any other page affected so far also I removed the !important since it's not necessary in this case but if you want you can add it back shouldn't do any harm .col-8 .ui.message { color: ; }

.

also note it will not affect the links inside the message even with the !important so if you want to modify those as well then the below selector will affect the links only in the message .col-8 .ui.message a { }

omg thank you! it worked. and i dont need to use !important to make it work. as it turns out. removing the space and comma between .ui and .message gives the result that i want. so simple. /facepalm

also nice tip with narrow down to col-8 class. why wouldn't i think of that before. haha.

i went with this in the end without col-8: .ui.message {color:;} it affect other area with "ui message" class too but that's ok since it is now standardized message box all over.

btw,

does this mean it will affect class for example "ui something message" or "some ui message" or "ui message some"?

thanks to both of you for helping me figuring this out!! 😘

all three scenarios are affected