Additional CSS Class (es)/theme twenty twenty two

  • Loek

    (@loek11)


    4 years, 3 months ago

    Hi, I am enthusiastically working on the theme twenty twenty two. I run into all sorts of crazy things. Perhaps there are more involved, then we can help each other.

    The first is the operation of Additional CSS Class (es), it responds to nothing. Example is the fill element and also column element, I want to give it a different color. That should be possible with:

    background-color: #f9a392; or
color: #f9a392; or
wp-block-spacer__background-color: #f9a392 or

body {
background-color: #f9a392;
}
or
.columnbackground {
background-color:#f9a392;
}

    Tried a lot but nothing works. How should it be done??

    Greetings
    Loek from Amsterdam

    • This topic was modified 4 years, 3 months ago by Loek.
    • This topic was modified 4 years, 3 months ago by Steven Stern (sterndata).
    • This topic was modified 4 years, 3 months ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Everything else WordPress topic
Viewing 8 replies - 1 through 8 (of 8 total)
  • Alan Fuller

    (@alanfuller)

    4 years, 3 months ago

    Ahh it seems that Additional CSS is loaded after Block Theme

    so adding a qualifier html sorts that

    e.g.

    html body {
  background-color: #f9a392;
}

    See https://ibb.co/gjMSKPV

    Thread Starter Loek

    (@loek11)

    4 years, 3 months ago

    Txt Alan. When I fill in on the left

    html

    .wp-block-spacer
    {
    background-color: #f9a392;
    }

    it works! But when I use the Additional CSS box on the right it dous not. Also not on the left the html and on the right

    .wp-block-spacer
    {
    background-color: #f9a392;
    }

    And when i work in the FSE mode the coloring is lost and on other webpages the color is not expected places seen?

    • This reply was modified 4 years, 3 months ago by Loek.
    • This reply was modified 4 years, 3 months ago by Loek.
    Thread Starter Loek

    (@loek11)

    4 years, 3 months ago

    And when i work in the FSE mode the coloring is lost and on other webpages the color is not expected seen?

    mrtom414

    (@mrtom414)

    4 years, 3 months ago

    have you looked in the inspector to see if the class is being added to your block? If it is where is it being added. Different blocks might add the class at different location in the block hierarchy. Also if background color is being defined inline you would have to add !important after your CSS rule to make it work. If there was a color in your block inspector its probably being defined inline. If your in chrome you can get to the inspector by right clicking and pressing Inspector. If in Edge press the f12 key.

    Alan Fuller

    (@alanfuller)

    4 years, 3 months ago

    But when I use the Additional CSS box on the right it dous not.

    Can you explain this – I don’t understand – what additional CSS box on the right?

    Maybe a link to a screen shot would help.

    mrtom414

    (@mrtom414)

    4 years, 3 months ago

    @alanfuller I believe they are referring to the addition classes in the advance section of the block inspector. The problem could be were the class is being placed. For example if you add it to an image it placed on the featured tag not the image. So if you try to adjust the image properties you might not get what you wanted. It better to make sure the class you added is where you think it is using the inspector.

    toneburst

    (@toneburst)

    4 years, 3 months ago

    I’m a bit confused as to where actually to add the Additional CSS in WP 5.9 and Twenty Two theme, as the Additional CSS item has gone from Appearance.

    Alan Fuller

    (@alanfuller)

    4 years, 3 months ago

    Always best to start your own topic. As often jumping on a different issue results in no one seeing it. It is also a forum guideline.

    For some reason they decided to hide the customizer for FSE Block enabled themes like 2020 and provide no obvious way.

    but you still can access it via yoursite.com/wp-admin/customize.php

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Additional CSS Class (es)/theme twenty twenty two’ is closed to new replies.