Tagged: , ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • September 18, 2020 at 12:42 am #1246613
    missouriartscouncil

    On my website’s homepage, I want right under our menu to have a thin solid color strip, full width, in which I can insert text. The purpose is to highlight the existence of my website’s COVID-19 resources. This is the page: https://www.missouriartscouncil.org

    I’m currently doing this via a text box within a Color Section. Section height is set at “No minimum height; use content within Section to define Section height.” There is no padding. The custom top and bottom margin option is not checked. A custom background color (bright red) was chosen.

    The strip has been working fine, but now I want it much narrower, more like the “Fall/Winter exhibitions on view” strip at the top of the homepage of this website: https://camstl.org/

    I tried the directions on this thread, the most recent one I could find on the Forum on the topic: https://kriesi.at/support/topic/change-height-size-in-color-section
    But they had no effect.

    I have created “CD19_banner” as the Custom ID Attribute for this section.

    How can I achieve the effect I’m looking for? In a way that will be fully responsive, too?

    September 19, 2020 at 1:02 pm #1246991
    Rikard

    Hey missouriartscouncil,

    Please try the following in Quick CSS under Enfold->General Styling:

    #c19_banner .av_textblock_section p {
  margin: 0;
}

    Best regards,
    Rikard

    September 19, 2020 at 8:24 pm #1247012
    missouriartscouncil

    Hi Rikard,

    I tried it. The height of the section has not changed. It looks like the top margin for the text box has been removed because the text has moved to the top of the color bar.

    I eventually want the text size to be 16px instead of 28px, but I’ve left it at 28px while we are working on this. I did do a test run with 16px, and got the same result of the text moving to the top of the colored bar.

    Thanks,
    Barbara

    September 21, 2020 at 3:45 am #1247228
    Jordan Shannon

    Hi,

    Did you add the code to the very top of quick css so it runs first? Also, clear the cache a few times over.

    Best regards,
    Jordan Shannon

    September 21, 2020 at 5:29 pm #1247414
    missouriartscouncil

    Hi Jordan,
    “Did you add the code to the very top of quick css so it runs first? Also, clear the cache a few times over.”

    Yes, I did both. Further steps:
    – Added c19_banner in the Developer section of Custom ID Attribute to BOTH the Color Section and the Text box.
    – Changed type size in text box from 28px to 18px.
    – Tested with and without adding !important, thus:
    #c19_banner .av_textblock_section p {
    margin: 0 !important;
    }
    – Cleared the cache several times after each change
    – Checked the page in Microsoft Edge as well as Google Chrome

    Nothing has made a difference.

    Just to be sure I am doing this correctly?
    – Should the Custom ID Attribute be “c19_banner” or “#c19_banner”? I have tried both ways.
    – “c19_banner” should go in Custom ID Attribute, not Custom CSS Class, right? (If you can point me toward a place in the Documentation, or even a post in the Forum, that explains the difference, that would be great!)

    September 22, 2020 at 7:49 am #1247531
    Rikard

    Hi,

    Please try this CSS as well:

    #c19_banner {
  min-height: 0;
}

    Best regards,
    Rikard

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