[addwebtodayParticipant]

Hello and thank you for a great theme!

I am familiar with classes and the Utility class list, but ran into an issue when trying to use two on one class field for one content band. I’d like to use both the following

text-white
center-text

I can add one, but when I add the other with a space or with a comma, only the first one works. What is the proper way of listing two of these in the same content band?

The content band I am testing this on is here.

Thank you!

[addwebtodayParticipant]

This reply has been marked as private.

[FriechModerator]

Hi There,

Thank you for writing in! Try to apply the class to element itself. Make the text-white property !important because the body font color you set on the customizer will be the priority.

Hope it helps, Cheers!

[addwebtodayParticipant]

Thank you for your response.

Your recommendation would work of course, but doesn’t relate to what I am trying to accomplish. Please view this example page with the access creds I provided. I am trying to include the two following CSS

text-white
center-text

I have added them as followed:

text-white; center text

This is not working. How can I add both of these to this content band and have them work? I don’t want to apply CSS in multiple areas and is the opposite of what I am trying to accomplish.

Please let me know how to modify the content bands so that adding the CSS styles provided by the theme are able to be applied properly.

Thank you!

[Rue NelModerator]

This reply has been marked as private.

[addwebtodayParticipant]

Hello,

I understand that this is an alternative, but is it possible to add TWO, both text-white and center-text, to the content band? If so, then how?

[ChristianModerator]

Yes, that is possible. Just separate them with spaces like

text-white center-text

in the Class field. If you use the shortcode, it would be like

[content_band class="text-white center-text"]

Hope that helps. 🙂

[addwebtodayParticipant]

Thank you for your help with this. I have update the content band on http://growsmiths.com/seattle/ with the exact code you provided

text-white center-text

and right now, the text is still black, but the alignment is centered. What is causing this not to work?

[RadModerator]

Hi there,

First, add this css at your customizer’s custom css.

.text-white {
color: #fff;
}

Second, you may add text-white to any element you wish to apply the styling. Content band is enough placement for that, but your text has local color or black. It’s inline styling.

Example,

<h1><span style="color: #000000;">Growsmith Seattle</span></h1>

You can see that color #000000 is directly applied to your text. Does, color styling using class names will not work.

Remove those inline styling if you wish text-white to be effective.

Hope this helps.

[addwebtodayParticipant]

I changed this styling and added the code and it’s still not working. I’m not sure why I have to add this custom text-white to the child CSS when there is a text-white within the X Theme class list. This seems counter productive to what the theme can do. Further more, before adding the code you sent, adding text-white to a content band by itself with render the text white. I am confused by your response.

[FriechModerator]

Hi There,

Sorry for the confusion. But X theme does not have an text-white utility class. So you need to define the class in your custom CSS. We are also confuse we thought you already have the text-white defined. Normally you would apply this class on the headings or paragraph element itself, applying this on content band would also work given that there is no inline style in the text element that would conflict with the css rule.

Cheers!

[addwebtodayParticipant]

Hello,

I understand. Still, the issue is not fixed. I currently have the following code placed in the content band verbatim.

center-text text-white

The text is not white. I would very much like to move passed this issue as it is trivial but widespread. I was told by support to place this code within the class field and it is not working. What can I do to fix this? Please go in and inspect the way I have the code set up.

[FriechModerator]

Hi There,

Thank you for updating the thread, I think we are getting close. We do not usually do this but sorry if I make the http://growsmiths.com/seattle/ a test page. The very first thing I did is to define the text-white class on the customizer.

.text-white {
	color: #fff !important;
}

Then I try to apply the text-white and center-text in same field and they applied correctly here. On the first column I applied the class in the column settings and it did applied to the headings and the text below it (the text is not visible because the background is also white). On the second column I applied the classes specifically to h2 heading so the text below it remained black.

Let me know if there is something that is not clear. Cheers!

[addwebtodayParticipant]

I don’t know how we have gotten so far off base, but I am trying to make the 1st CONTENT BAND contain the code that was originally provided by support, and is the reason for this back and forth, which is listed below:

center-text text-white

1) I am not asking for customization. This was provided by support and is not working.
2) The issue I am describing is still not being worked on. The last provided example is exactly what I am NOT trying to achieve. I want the CONTENT BAND to contain the following code

center-text text-white

with the result of the text being CENTERED, and the font being WHITE. I don’t want ANY element within the content band to require ANY additional styling. The goal here is to make sure the following code:

center-text text-white

Is able to be placed within the class field on the CONTENT BAND level. The example we are testing is the FIRST CONTENT BAND.

Again, I don’t want to change INDIVIDUAL CLASSES, I want to OVERRIDE all class styles that are within a content band with the following code:

center-text text-white

added to the class field of the content band.

If this is not doable, please for the love of time and effort, just say so. The request was SUPER simple and I have no idea how we got this far without a simple answer.

[FriechModerator]

Hi There,

The two classes center-text text-white are already working now together, just try to add a plain text. The reason why the heading “GROWSMITH SEATTLE” still in gray because the heading font color settings on the customizer is more specific, you could change that but it would applied site wide. For you to override that specifically you need to create a custom css rule with a more specific selector e.g. #x-content-band-1 h1 or put the rule as inline css just like the black text below it “YOUR CONNECT FOR SPECIALITY AGRICULTURE PRODUCTS”. I know you don’t want another custom css but that’s the only way.

Hope it helps, Cheers!

[Author]

Posts