Tagged: ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • December 9, 2015 at 1:09 am #549362
    cd2s

    Hi

    We are using the grid rows on a website to create a table like structure (tables are too difficult to use for the end user to add the content (links, buttons etc). It works really well. The only issue I have is that the grid row goes full screen width and does not left/right align with the rest of the content.

    I tried to get around it by adding more left padding on the left most grid column and more right padding on the right most column. This will fix it on normal screen, but then as soon as I view it on the iphone (or a small screen) it stuffs it all up, as the padding I added is too much for the small screens….

    I’ve pasted the link to the page below, so you can have a look. Basically the “Date” on the left should be aligned with the “Past Performances” title and the socket content….

    Thanks so much for your help.
    Corina

    December 9, 2015 at 3:39 am #549404
    Elliott

    Hey Corina!

    Try adding this to a codeblock element in the page content.

    <style type = "text/css">
.flex_cell.avia-builder-el-first {
    vertical-align: top !important;
}
</style>

    Regards,
    Elliott

    December 18, 2015 at 9:30 am #554873
    cd2s

    Hi Elliott

    Thanks for sending that through. I just added it to a code block on the actual page and it doesn’t move anything. I’ve pasted a link below so you can see what I’d like to achieve.

    Also let me know if you’d like access to the website.

    Thanks so much for your help.
    Corina

    December 18, 2015 at 3:57 pm #555031
    Yigit

    Hi!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (min-width: 990px) {
#av-layout-grid-1, #av-layout-grid-2, #av-layout-grid-3, #av-layout-grid-4, #av-layout-grid-5 {
    padding-left: 85px;
}}

    Best regards,
    Yigit

    December 21, 2015 at 5:45 am #555746
    cd2s

    Hi Yigit

    Awesome, it fixed the website on pc/mac but it now has no margin at all on mobile.

    https://www.dropbox.com/s/6nqkvmeocuc8gqw/File%2021-12-2015%2C%2014%2040%2046.png?dl=0

    Thanks so much for your help.
    Corina

    December 21, 2015 at 6:11 pm #556104
    Yigit

    Hi!

    Please change the code to following one 

    
#av-layout-grid-1, #av-layout-grid-2, #av-layout-grid-3, #av-layout-grid-4, #av-layout-grid-5 {
    padding-left: 85px;
}

    Best regards,
    Yigit

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