Change Background colour of custom HTML section (prestige theme)

[SDBdigital]

Hi

I need to change the background colour (and if possible make the width full screen) of the Custom HTML section in Prestige theme.

Here is the liquid file for the custom HTML section:

<section class="Section Section--spacingNormal" id="section-{{ section.id }}">

  <div class="Container">

    {%- if section.settings.subheading != blank or section.settings.title != blank -%}

      <header class="SectionHeader SectionHeader--center">

        {%- if section.settings.subheading != blank -%}

          <h3 class="SectionHeader__SubHeading Heading u-h6">{{ section.settings.subheading | escape }}</h3>

        {%- endif -%}

        {%- if section.settings.title != blank -%}

          <h2 class="SectionHeader__Heading Heading u-h1">{{ section.settings.title | escape }}</h2>

        {%- endif -%}

      </header>

    {%- endif -%}

    <div class="Rte" style="text-align: center">

      {{ section.settings.html }}

    </div>

  </div>

</section>

{% schema %}

{

  "name": "Custom HTML",

  "class": "shopify-section--bordered",

  "settings": [

    {

      "type": "text",

      "id": "subheading",

      "label": "Sub-heading",

      "default": "Sub-heading"

    },

    {

      "type": "text",

      "id": "title",

      "label": "Heading",

      "default": "Your HTML"

    },

    {

      "type": "html",

      "id": "html",

      "label": "HTML content",

      "default": "<p>Write your own custom HTML content.</p>"

    }

  ],

  "presets": [

    {

      "category": "Advanced",

      "name": "Custom HTML",

      "settings": {}

    }

  ]

}

{% endschema %}

[oscprofessional]

Hello.....
Please share your store URL and screenshot.
So that I will check and let you know the exact solution here.

[SDBdigital]

Hi

The URL is https://comfi.co.nz (password: comfibed)

In the attached screenshot the section with the ligh tblue background is a Custom HTML section. I've managed to specify the lightblue background for the divs in the section, but not for the entire section.

[oscprofessional]

 

Hi,

Remove this container , add custom class "anything name there"

then write css for background color

[SDBdigital]

LOL, you make it sound easy, but where do I do this?

[Clarke-]

@SDBdigital if you are struggling with those instructions you can add this to the end of your SCSS liquid file.

#section-1603269789d9408e52 {
    background-color: #EFF8F2;
}

Please be aware because this targets that section if you delete it or add others you will need to change the section it is targeting (you can get the section by using your browser inspect element tool). 

for example you want to target the  "minimise movement" "keep moisture away" section you would change the code to target #section-1602679642418

[SDBdigital]

HI Clark

I added your code to my css file - but it didn't change anything.

Or maybe it did, but I cant see it because the section doesn't stretch to full screen.

[Chemainus]

Hi Guys,

I'm struggling following the instructions here, can any please post a simple and easy to understand instuctions how to change the background color in "custom HTML" in prestige theme please?

Thank you.

[oscprofessional]

@Chemainus ,
share your site url..