Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #1240935

    Hello,

    sorry for my posting but I’m out of ideas and can’t find a solution here in the forum.

    I have to problems but I guess it’s kinda the same. Both are regarding the spaces between layout elements in mobile view.
    Here is a giant space I can’t edit in the designer. But I need the same space as between the other elements.
    Space
    This is how this page looks like in the editor:
    'Designer
    Google Chrome Dev.tools shows this orange space (I don’t know what that is? padding?)
    Chrome DevTool

    On another page there is also a space (I don’t want any space between this elements):
    Space

    Can you help me out here?
    Thank you very much,
    Gerald

    #1241038

    Hey KatrinHei,

    Please provide a link to the site/page in question so we can look into this issue further.

    Best regards,
    Jordan Shannon

    #1241039

    Hey KatrinHei,

    Please provide a link to the site/page in question so we can look into this issue further.

    Best regards,
    Jordan Shannon

    #1241135
    This reply has been marked as private.
    #1241707

    Hi,

    Add this to quick css:

    @media only screen and (max-width: 767px)  {
    #top .flex_column_table.av-equal-height-column-flextable:not(:first-child) {
        margin-top: 0px!important;
    }}

    Best regards,
    Jordan Shannon

    #1241720

    Thanks that solved my first problem.

    But the bigger one is the second: on this site https://www.heinisch-weber.at/schwerpunkte/ I don’t want any space between the elements in mobile view like it is in desktop view:
    Space between elements
    It seems there is also a bottom margin? Why is there no option in the element for it?
    Space between elements
    and here:
    Space between elements

    How can I get rid of this space in mobile view? Thank you very much.

    #1242095

    Hi KatrinHei,

    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

    
    @media only screen and (max-width: 767px) {
        .responsive #top .container .av-content-small,
         .responsive #top #wrap_all .flex_column,
         .responsive #top #wrap_all .av-flex-cells .no_margin,
         .responsive .content {
                margin-bottom: 0px;
         }
         .responsive .content {
             padding-bottom: 0;
         }
    }
    

    If you need further assistance please let us know.

    Best regards,
    Victoria

    #1242177

    Hi Victoria,

    thank you that almost worked. I had to add “!important;” at the end.

    For others with this problem. This is the working code:

    
    @media only screen and (max-width: 767px) {
        .responsive #top .container .av-content-small,
         .responsive #top #wrap_all .flex_column,
         .responsive #top #wrap_all .av-flex-cells .no_margin,
         .responsive .content {
                margin-bottom: 0px!important;
         }
         .responsive .content {
             padding-bottom: 0px!important;
         }
    }
    
    • This reply was modified 4 years, 7 months ago by KatrinHei.
    #1242290

    Hi,

    Did you need additional help with this topic or shall we close?

    Best regards,
    Jordan Shannon

    #1242385

    Hi,

    no thanks the problem is solved. You can close this ticket.

    Best regards,
    Gerald

    #1242393

    Hi Gerald,

    We’re glad to hear that :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Space between layout elements’ is closed to new replies.