Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • June 14, 2020 at 4:38 pm #1222485
    tremblayly

    Hi
    On this page here: https://silviafindings.com/about-us in section 2 I use a background image and use a specific height. Within that section I have one fullwidth column for the title (with a white transparent background), then I have two different width columns at the bottom of the image with text and also using the white transparent backgrounds. I am trying to have the white background columns color to extend to the left and right edge of the image (page). I tried creating an id for each columns, flex-co1, flex-col2, flexcol-3 that adjusts the margin-left: -50px!important; but nothing works. I know that if I adjust the “top .flex_column_table” left margin, it does what I want, but of course that isn’t what I want for the entire site. I want to me specific to elements placed within that section only (so to place elements in specific spots on the image).

    I read through the documentation on the columns and sections but could not make the changes take effect.

    Can you help me figure this one out please?
    Thank you
    Lyse

    June 14, 2020 at 9:33 pm #1222515
    Nikko

    Hey Lyse,

    Can we ask for a screenshot or mockup of what you’re trying to achieve? it should help us give you CSS code that should work.

    Best regards,
    Nikko

    June 14, 2020 at 11:53 pm #1222530
    tremblayly

    Hi Niko,
    Screenshot of current view – look at the pick highlighted left and right margins :https://snipboard.io/iQyuSB.jpg
    I want the white background of these flex columns to right to the edge of the screen. Right now they stop to the set margin of the section element.
    Here’s a screenshot of the look I’d want to accomplished by looking at the black highlighted corners of the image – the background of the flex columns should continue the white background right to the edge of the screen.

    Hope this clarifies what I want to happen
    Thanks
    Lyse

    June 15, 2020 at 4:28 pm #1222717
    Victoria

    Hi Lyse,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
#top.page-id-33029 #av_section_2 .container {
    padding: 0;
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    June 15, 2020 at 5:09 pm #1222751
    tremblayly

    Hi Victoria,
    Thank you for the CSS code but even using” !important” the code is not working.
    Lyse

    June 15, 2020 at 11:57 pm #1222865
    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 time over.

    Best regards,
    Jordan Shannon

    June 16, 2020 at 1:47 am #1222889
    tremblayly

    Hi Jordan,
    Your suggestions worked!
    Thank you so much.
    Lyse

    June 16, 2020 at 4:39 am #1222900
    Jordan Shannon

    Hi,

    Perfect!I’m happy it was resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Flex Columns margins’ is closed to new replies.