[Resolved] background color to a gutenberg block

Home Forums Support background color to a gutenberg block

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1028772
    Pauline

    Hello

    Is there a way of filling a whole gutenberg block that contains columns, with a background colour and padding it out so that the colour extends to a border?

    I have a gutenberg block which contains 2 columns. The left column has an image, and the right column has text. I have only been able to succeed in adding a background colour to the right column (text).

    The left column (image) has the following CSS:

    .wp-block-image .wp-image-138 {
        margin-left: 150px;
    }

    And the right column (text) has the following CSS:

    .bluetext {
        margin-right: 125px;
    }

    If you look on my site, it is the block underneath the page hero.

    Thankyou
    Pauline

    #1028814
    Leo
    Staff
    Customer Support

    Hi there,

    You will need to target the entire columns block like this:
    https://www.screencast.com/t/5mzd4dSg

    Give that columns block a specific class if you don’t want to change the background color of all the columns.

    I’ll also mention that these aren’t really theme related questions.

    If you are struggling editing things with HTML and CSS, I would recommend look into a page builder option 🙂

    #1029028
    Pauline

    Hi Leo

    Thanks for the screenshot. I really do appreciate your time and help. I have used Elementor before with GP, and it’s really easy to come up with a good looking site. However, through this experience, I have come to learn of the functionalities and capabilities of GP, and I am currently trying to learn how to use GP without a page builder. Once I “get it” I know my struggles will have been well worth it for the long term.

    Is there a service that can help me with the questions I have been asking? I just get stuck sometimes, and just need someone to help me move forward.

    Thankyou
    Pauline

    #1029480
    Leo
    Staff
    Customer Support

    I’m not aware of service for general HTML and CSS help unfortunately.

    I learned the basics using the free lessons from this site:
    https://www.codecademy.com/

    Then it’s all about getting familiar with browser inspector tool 🙂

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.