Generatepress overflow container

  • Resolved werfewr

    (@werfewr)


    4 years, 4 months ago

    Hey! Thank you for awesome plugin. However on my site is little buggy. It overflows the container of page – I am using generatepress premium.

    Also it doesnt display icons. It is propably not compatible with font awesome plguin :(..

    The page I need help with: [log in to see the link]

Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Author eedee

    (@eedee)

    4 years, 4 months ago

    for me there is no overflow. do the font awesome icons work on other (sub-)pages?

    Thread Starter werfewr

    (@werfewr)

    4 years, 4 months ago

    I dont know your resolution, but check it again. On mobile it works. On 1920×1080 monitor, there is horizontal slider in browser.

    Here is the screenshot: https://pasteboard.co/IIUf8MP.png

    I am not using it elsewhere. But font awesome normally works. I am using it on product pages for example: https://beta.gastrojet.cz/gastrotechnika/manual-poemia-fokus/.

    Plugin Author eedee

    (@eedee)

    4 years, 4 months ago

    Is this still a Problem?

    Thread Starter werfewr

    (@werfewr)

    4 years, 3 months ago

    Yes it is, can you help?

    Plugin Author eedee

    (@eedee)

    4 years, 3 months ago

    Hey @werfewr,

    1. I tested your site in safari, chrome and fireforx and the overflow is not happening in my case. Can you update your browsers and disable Addons, to see if it is an issue with your setup please. Also send me information about the browser and OS you are using to being able to reproduce the issue.

    2. You are right with font awesome on your site. Seems to be an issue with your theme + Gutenslider. It seems, some script is replacing font-awesome font icons with SVGs. The following Css should fix it:

    .wp-block-eedee-block-gutenslider.arrow-style-1 .slick-prev::before,
.wp-block-eedee-block-gutenslider.arrow-style-1 .slick-next::before {
    content: unset !important;
    width: 0 !important;
    height: 0 !important;
}

.wp-block-eedee-block-gutenslider .slick-prev svg,
.wp-block-eedee-block-gutenslider .slick-next svg {
    width: 50px; /* set to the height + widht you want */
    height: 50px;
    color: #fff; /* set to the color you want */
}
    • This reply was modified 4 years, 3 months ago by eedee.
    Thread Starter werfewr

    (@werfewr)

    4 years, 3 months ago

    Hey! Thanks for the fix of Icons.

    The overflow issue happens in all browsers for me. I am on laptop with 1920x1080px.

    I have deleted cache, used clean installation of firefox developer edition and still getting it. It loads well, but there is still little overflow of container.

    Look at here: https://imgur.com/7RETTld

    • This reply was modified 4 years, 3 months ago by werfewr.
    Plugin Author eedee

    (@eedee)

    4 years, 3 months ago

    hmm it seems a windows issue. its not happening on mac. do you have css experience? you can try to add

    overflow: hidden

    to certain elements of the slider and try if it goes away.

    Thread Starter werfewr

    (@werfewr)

    4 years, 3 months ago

    Hi, I have already tried the overflow hidden, on every element inside gutenslider. It does nothing. I think there is a problem with this class which set the size to 100vw

    screenshot: https://imgur.com/T9TMAbc

    Thread Starter werfewr

    (@werfewr)

    4 years, 3 months ago

    Ok, the fix is, to set
    overflow-x:hidden;

    on whole body element. Strange, but working 🙂

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Generatepress overflow container’ is closed to new replies.