Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • June 20, 2023 at 1:30 pm #1411171
    ballindigital

    Hi,

    You guys helped me out with the spacing on desktop view and mobile view with my homepage:

    Home

    This was the thread:

    Get rid of unnecessary whitespacing on mobile view..

    I’ve duplicated the homepage as I needed to create an alternative one:

    Official Distributors of Lumifil Ireland

    I’m having similar issues with the spacing..

    Are you able to help please?

    Thanks :)

    June 21, 2023 at 11:26 am #1411255
    Rikard

    Hey ballindigital,

    You can try adding the same CSS as in the other thread, but replace

    .home

    with

    .page-id-1254

    Best regards,
    Rikard

    June 21, 2023 at 1:13 pm #1411268
    ballindigital

    Hi Rikard,

    Unfortunately that didn’t work.

    Desktop View

    Here is an image of the desktop view and I have drawn in red the area that I want to delete.

    View post on imgur.com

    Mobile View

    Here is an image of the mobile view and I have drawn in red the areas that I want to delete.

    View post on imgur.com

    Can you help with this please?

    Thanks!

    June 22, 2023 at 5:12 am #1411340
    Ismael

    Hi,

    Thank you for the updat.e

    Have you tried moving the code block inside the color section where the promobox container is located? This should remove the unnecessary space created by the section element which is automatically created for “orphaned” elements or elements outside a container. If it doesn’t work, try to add this css code.

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

  /* Add your Mobile Styles here */
  .page-id-1254 #after_section_3 {
    display: none !important;
  }
}

    To remove the space below the header, try to use this css code.

    @media only screen and (max-width: 767px) {

  /* Add your Mobile Styles here */
  .page-id-1254 #av_section_1 {
    margin-top: -50px;
  }
}

    Best regards,
    Ismael

    June 22, 2023 at 8:10 pm #1411416
    Guenni007

    this is caused by those new parallax effects.

    My recommendation is : do not enter at the first setting a value:

    these will determine the whole media screen settings !!! so even for the responsive screens when columns etc. are switched to show beneath each other.
    But on those little screen it does not make any sense.

    Therefore, I usually leave the first element unedited and set the parallax effect and positioning settings only for the following two screen widths. (2nd and 3rd screen icon) – if you switch to responsive design at 990px – then only the values below the 2nd screen icon need to be set.

    Unfortunately, this was not done in the demo, which is why I also fell into this “trap”.

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