Home › Forums › WoodMart support forum › Stretch Section Issue

Stretch Section Issue

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • August 20, 2023 at 6:48 pm #489911

    leejay123
    Participant

    Im having some problems with the Woodmart Theme.

    I have created a HTML block for the footer and set It like this https://gyazo.com/9a090230d381d5fd4aa2ef1ef02e5285

    I have also created many more pages with the Elementor page builder and regardless of the page If I use the [Xtemos] Layout and select, ” Stretch Section,” – see here https://gyazo.com/664dcbbda63f76367dc87c6a6250f420 I aways have overlapping Issues on the page within landscape Mode on Mobile while using the Firefox browser on mobile devices such as Iphone but If i’m using any other browser on mobile while In landscape mode there Is no issues.

    Within the Elementor page builder If i go to Section/layout – [Xtemos] Layout and select, ” Stretch Section,” I have noticed that within Firefox that the section overlaps the page on Landscape Mode on mobile. – I have attached a file called, “Issue Firefox,”
    However If you test on Chrome Landscape Mode on mobile or any other browser It works completely fine.

    This is quite frustrating.
    This is not a third party plugin Issue.
    Prior to this topic I cloned my website and deactivated all plugins except Woodmart plugins but the Issue still there!
    If i create a and page and stretch sections the text, images etc overlaps if using firefox Landscape!!!!

    I have attached 2 images
    One called Firefox Issue
    One called works on chrome

    • This topic was modified 1 year, 3 months ago by leejay123.
    • This topic was modified 1 year, 3 months ago by leejay123.
    Attachments:
    You must be logged in to view attached files.
    August 21, 2023 at 10:02 am #490027

    Luke Nielsen
    Keymaster

    Hello,

    I see that you use the “Full width” option from Elementor (https://prnt.sc/DbGuFqnumjcG) and the “Section stretch CSS” functionality from our theme at the same time. Unfortunately, it could cause some issues if you use these functionalities at the same time, you can read the description of our option where mentioned that you can enable it instead of Elementor’s feature: https://prnt.sc/zKwOO_6fF5gk , so please disable the “Full width” functionality from Elementor, clear all caches and recheck the issue on your mobile device.

    Kind Regards

    August 21, 2023 at 8:04 pm #490226

    leejay123
    Participant

    Okay, Im now working on the custom footer HMTL Block that overlaps on Firefox.
    These are the settings I have In place already https://gyazo.com/988d0c6ebc874ec8f3978cdc9d0a7dd4
    The Issue still there In firefox?

    August 22, 2023 at 11:50 am #490387

    Luke Nielsen
    Keymaster

    Hello,

    I have checked the footer in Firefox on the mobile device, and it looks well, here is a screenshot: https://prnt.sc/NpfUqv7U6HYI

    So please explain how can I replicate that issue on my side.

    Kind Regards

    August 22, 2023 at 12:57 pm #490428

    leejay123
    Participant

    I think Its based on the Iphone Device,

    I have tested this on a second device while using Firefox landscape mode, on the Samsung Note 9 and it works completely fine with no Issue!!!

    Im using the Iphone 14 pro Max.
    As mentioned, this is only in landscape mode.
    See attached screenshot on Iphone 14 pro Max landscape mode.

    Attachments:
    You must be logged in to view attached files.
    August 22, 2023 at 5:42 pm #490534

    Luke Nielsen
    Keymaster

    Hello,

    After we looked into the situation, we found that the issue is related directly to the browser Firefox because as you can see in the below screenshot, the default theme has the same issue, the footer is cut from both sides.

    https://prnt.sc/sIel6MkZ0lf4

    So it is not something caused by our theme.

    Kind Regards

    November 20, 2023 at 6:51 pm #513914

    leejay123
    Participant

    Then why does woodmart demos not have the same issue when In landscape on Firefox browser?

    November 21, 2023 at 11:36 am #514059

    Luke Nielsen
    Keymaster

    Hello,

    Please add the below code in Theme Settings -. Custom CSS -> Global Custom CSS area to disable the stretch section option on mobile forcefully.

    @media (max-width: 1024px) {
.elementor-section[class*="wd-section-stretch"] {
	position: static;
	min-width: unset;
	width: unset;
}
}

    After that, you may have to readjust the side paddings on the stretch sections on the mobile.

    Kind Regards

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)