Tagged: 

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • November 7, 2016 at 4:40 pm #709353
    WP Turned UP

    Hello. On the Service Promises section of the home page, I have a a custom CSS class specified of “home-grid-row-services-promises-left”. I then have the following CSS, to try and set the padding on iPad Portrait. I’m seeing no change.

    @media only screen and (max-width: 768px) {
    #home-grid-row-services-promises-left {
    padding: 0px 0px 0px 20px;
    }}

    Thank you,
    Ryan

    November 8, 2016 at 1:58 am #709586
    WP Turned UP

    This section looks great in all media queries except iPad portrait. If you could help me just stack the grid rows for this mode, I believe I can call it a day.

    Thanks,
    Ryan

    November 8, 2016 at 2:25 am #709590
    Yigit

    Hi!

    Please try adding following code to Quick CSS 

    @media only screen and (max-width: 990px) and (min-width: 768px) {
#service-promises .flex_cell {
    display: block!important;
    width: 100%!important;
}
#service-promises {
    display: block!important;
}}

    Regards,
    Yigit

    November 8, 2016 at 3:22 am #709592
    WP Turned UP

    Thanks, that took care of the stacking. I just need to center the content of both grid row elements. It seems like CSS for Grid Row is hard to find and change. Looking in Chrome tools, I never would have found the CSS you gave me.

    November 8, 2016 at 2:35 pm #709811
    Yigit

    Hi!

    Please add following code to Quick CSS as well

    @media only screen and (max-width: 990px) and (min-width: 768px) {
#service-promises .flex_cell {
    padding: 0 50px!important;
}}

    If that does not help, please post a screenshot and show the changes you would like to make.

    Cheers!
    Yigit

    November 8, 2016 at 2:44 pm #709826
    WP Turned UP

    Thank you, we’re close. Now, I just need to remove the White bar as seen here.

    November 8, 2016 at 2:46 pm #709830
    Yigit

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    @media only screen and (max-width: 990px) and (min-width: 768px) {
#service-promises .flex_cell.left-grid-row {
    margin-bottom: -20px!important;
}}

    Best regards,
    Yigit

    May 11, 2023 at 1:57 pm #1407114
    nolka

    Can I move the entire grid row upwards to reduce the negative white space for mobile devices?
    If it was a section I could use the margins to change the top margin to a -80px, which would move it up as needed – but I don’t have this facility with the grid row.
    Can you help?
    Kevin.

    May 12, 2023 at 4:49 am #1407171
    Ismael

    Hi,


    @nolka    : You can use css to apply the negative top margin to the grid row element. Please check the following documentation for more info about custom css.

    // https://kriesi.at/documentation/enfold/add-custom-css/#enable-custom-css-class-name-support

    If you need more help, please feel free to open another thread.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Grid Row – Mobile Padding’ is closed to new replies.