Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • January 27, 2022 at 4:57 am #1337384
    navindesigns

    My section mockup – https://ibb.co/vhC02fK

    Live site – http://balrajt8.sg-host.com/

    I am trying to create that block at the bottom (above the footer). I have set it up as a grid row and within each grid row I am trying to use flex box.

    One problem is if i make my browser really wide, there is alignment issue
    Screenshot – https://ibb.co/qCGfQ44

    I need the contents (not the background color) to stay within the site width.

    I tried the following code
    .av-layout-grid-container {
    max-width: 1210px !important;
    margin: 0 auto !important;
    border: none !important;
    }

    This fixes the content alignment, however the site background colors comes into play on the far right and far left which i dont want
    screenshot. – https://ibb.co/4p3dHdC

    any guidance will be appreciated

    January 27, 2022 at 10:19 am #1337456
    Ismael

    Hey navindesigns,

    Thank you for the inquiry.

    The grid row element is a full width element without an inner container, margins and borders, so that is to be expected. It is not the same as the color section, which wraps the element inside an inner container with a defined width, which can be set in the Enfold > General Layout > Dimensions > Maximum Container width field.

    If you want to limit the width of the grid row, try to use this css code.

    .av-layout-grid-container {
    max-width: 1310px;
    margin: 0 auto;
}

    The max-width value above should be same as the Maximum Container width to align it perfectly with the existing color sections.

    Best regards,
    Ismael

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