Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • September 27, 2023 at 12:59 pm #1420698
    Sachs

    Hi Enfold
    I’m trying to adjust the cell padding in grid rows for larger screens, as only the text should be aligned with the left or right margins (not the images)
    In attached print

    When adjusting cell padding the top, bottom, left and right nothing changes. I have no issues with adjusting for laptop/notebook, tablets, smartphones.

    Customer would like text in the grid rows to align with the margins.

    What is the solution? Or how to make the adjustments?

    Best regards
    Lene

    September 28, 2023 at 5:48 am #1420747
    Ismael

    Hey Lene,

    Thank you for the inquiry.

    Looks like you managed to adjust the padding of the cell containing the text for different screen sizes. If the changes don’t immediately reflect in the frontend, try to toggle or temporarily disable the Enfold > Performance > File Compression settings and make sure to purge the cache before testing the page.

    Best regards,
    Ismael

    September 28, 2023 at 9:07 am #1420774
    Sachs
    This reply has been marked as private.
    September 28, 2023 at 2:34 pm #1420809
    Ismael

    Hi,

    Thank you for the update.

    What is the screen resolution of your monitor? In your screenshot, looks like you have a high-resolution monitor or have zoomed out the page. If you want to increase the padding for monitors with a screen resolution higher than 1920x1080px, try to add this css code.

    @media only screen and (min-width: 1920px) {

  /* Add your Desktop Styles here */
  .responsive #top #wrap_all .flex_cell.av-irwte-402a46cb11dcc3db2b5c85605d88b8cc {
    padding: 80px 300px 80px 80px !important;
  }
}

    Best regards,
    Ismael

    September 28, 2023 at 4:53 pm #1420824
    Sachs
    This reply has been marked as private.
    September 28, 2023 at 8:21 pm #1420837
    Sachs
    This reply has been marked as private.
    September 29, 2023 at 2:49 am #1420848
    Ismael

    Hi,

    Thank you for the info.

    The css modification is not getting applied because it gets overridden by the rules in the posts css file. To fix the issue, please add this code in the functions.php file.

    function ava_enqueue_child_styles() {
    wp_enqueue_style( 'av-child-posts-css', get_stylesheet_directory_uri() . '/av-child-posts.css' );
}

add_action( 'wp_head', 'ava_enqueue_child_styles', 10 );

    After that, create a file called “av-child-posts.css” in the child theme directory, then add this css code.

    @media only screen and (min-width: 1201px) {

  /* Add your Desktop Styles here */
  .responsive #top #wrap_all .flex_cell.av-irwte-402a46cb11dcc3db2b5c85605d88b8cc {
    padding: 80px 300px 80px 80px !important;
  }
}

    This should override the default posts css styles and increase the padding of the cell on larger screens.

    Best regards,
    Ismael

    October 6, 2023 at 2:59 pm #1421649
    Sachs
    This reply has been marked as private.
    October 7, 2023 at 11:28 am #1421731
    Rikard

    Hi,

    Thanks for the update, we’ll go ahead and close this thread for now then. Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Cell padding: Larger screens’ is closed to new replies.