Home Forums Community Forum section separator bug

Only users with a registered purchase of Avada can post to the community forum. Please register your purchase here.
Viewing 15 posts - 1 through 15 (of 17 total)
  • Author
    Posts
  • g33kmonkey
    Participant
    Post count: 8

    I really like the way they use the section separator in the demoe: https://avada.theme-fusion.com/influencer/

    but check it out in mobile devices like an iphone, … there are several problems with the blue waves. First you see some border/white square and then there is a white small gap on the left side.

    Is there any way to fix it? Really would likt to work with this kind of style – but it looks lie of cheap on an mobile device

    Ammar. S
    Keymaster
    Post count: 1572

    Hello @G33monkey

    I see no issues with the section separator when used on mobile too as can be seen here => https://share.getcloudapp.com/nOulvJpp, this is taken from an iPhone 12 Pro Max, however in any case if you do not like it on mobile you can always disable them and use other separator style using our visibility options.

    Thanks

    -Ammar

    Racquel
    Participant
    Post count: 1

    I am having the same issue. It has a gap on my iphone 12 but not on my samsung note 10. It’s been driving me insane trying to fix.

    g33kmonkey
    Participant
    Post count: 8

    Thx! I also spend more than 3 hours and finally gave up.

    There is no problem with an tablet, there is no problem if you just make the browser tab small … but on top and Bottom of the blue design there are problems on the iPhone 12 Pro – I tested all 4 devices at home. All ended up with the same problem. On top can see the border and on bottom is this gap which also drives me crazy as I don’t understand why 😩

    Would be awesome if theme fusion could fix it.

    mnovakdesign
    Participant
    Post count: 2

    I have another wrinkle which I am going to file a ticket on now.

    – I am building a website and made two global elements about 10 days ago—both are Separators (rules, not sections). The spacing and style on the element is different for the two and used in multiple ways across the site—and I’ve built out about 40 pages so far using them. No problems.
    – Fast-forward to today and I am getting 502 errors all over the place. And, when I go to edit the page—the global Separators are GONE.
    – Went to the Avada > Library and looked at them = element is GONE.
    – Put the element back in, saved it, checked again (because I was getting paranoid)
    – Went back to page and re-inserted them
    – Updated page, looked at page, they’re there
    – Back to backend edit mode = GONE
    – Back to Avada > Library and the Element is EMPTY again.

    Basically, something in the theme is eating my Separators!

    No known plugin updates or installed update between working and nor working. PHP and WordPress up to date, since it was a new site, they were installed at the start of the build.

    • This reply was modified 1 week, 3 days ago by mnovakdesign.
    g33kmonkey
    Participant
    Post count: 8

    seems like a bug to me – I bought the theme several times but I’m not willing to extend my support level again, as I guess this should be solved anyway, …

    https://ibb.co/ftk3y30
    https://ibb.co/PG5BJgS

    marklchaves
    Participant
    Post count: 717

    Hi @g33kmonkey,

    I can reproduce the separator issue on the Influencer demo site on an iPhone and iPad. Here’s a screen capture of what’s going on with my recommendation included.

    https://imgur.com/a/3qESKrS

    You’ll see there are 2 options. Either set the margin-bottom of the div above to -1px or the margin-top of the div below to -1px.

    Here’s the CSS I applied to the top div that worked for me.

    
    
    .fusion-body .fusion-flex-container.fusion-builder-row-2 {
      margin-bottom: -1px;
    }
    
    

    Good luck! 🙂

    Mark

    g33kmonkey
    Participant
    Post count: 8

    thx buddy, but if I add to my sites custom css (for me it’s row-1, as I deleted the first row):

    .fusion-body .fusion-flex-container.fusion-builder-row-1 { margin-bottom: -1px !important; }

    the visible border like in my picture 1 disappears, …. but now i looks like the second picture I posted :/ – this just looks dump.

    You can check out: https://small-ocean.com – nothing done there so far.

    I also restartet nginx, purged the cache and even did a rm -rf /nginx/cachepath... – dunno whats the problem 🙁

    • This reply was modified 1 week ago by g33kmonkey.
    • This reply was modified 1 week ago by g33kmonkey.
    marklchaves
    Participant
    Post count: 717

    Forgive me. I actually don’t know what the issue is on the second image you posted.

    https://ibb.co/PG5BJgS

    Can you be more specific?

    The same thing goes for your site. I don’t see what you mean by dump when I switch to iPhone or iPad.

    Sorry, I’m being a little thick.

    Thanks!

    Shaminder
    Keymaster
    Post count: 80

    Hi

    The issue is specific to a few iOS based devices (I believe the issue is not replicable in android/iPhone 12)
    If you do see any issue showing in such a device, please edit the container/column below the separator and give it a -1px margin specific to mobile/tablet mode, Screenshot here → https://prnt.sc/103f3v0

    Note that the Avada community forum is primarily for a user to user interaction.

    If you would like hands-on assistance here, please register for support and create a support ticket as explained here → https://theme-fusion.com/avada-doc/getting-started/avada-theme-support

    Thank you!

    Shaminder

    g33kmonkey
    Participant
    Post count: 8

    Thx for the help, but this just solves the first problem, the second problem like the small gap still exists, now even on top and bottom of the blue part :/

    Shaminder
    Keymaster
    Post count: 80

    Hi @g33kmonkey

    I could have missed it out but can you add screenshots of the issue area once again and help me with the link to where you see this

    Thank you, Shaminder

    g33kmonkey
    Participant
    Post count: 8

    Hey thx for the help!

    Here you go: https://ibb.co/P9VrNfk

    Still the same page: https://small-ocean.com

    I tried to mark it, so you can see. Its a really small gap, but just looks unprofessional and some how cheap – haha.

    Thx in advance!

    Shaminder
    Keymaster
    Post count: 80

    Hi @g33kmonkey

    Can you please edit the container in which the separator is and remove the left padding of the container. There can be default padding too and in such a case specify the padding left as 0px. If you have any other content the container that is affected by this, move that content into a separate container or used the column padding option

    Thank you

    • This reply was modified 6 days, 6 hours ago by Shaminder.
    g33kmonkey
    Participant
    Post count: 8

    I now even put the 2 Separators in 2 different containers. But it’s even getting worse with the 0px padding.

    But have a look: https://ibb.co/MnRrXr3

    Or check the page by yourself. Very strange 🙁

    Thx for the help!

Viewing 15 posts - 1 through 15 (of 17 total)
Only users with a registered purchase of Avada can post to the community forum. Please register your purchase here.