mobify / pikabu

Off-Canvas flyout menu
http://mobify.github.io/pikabu/
MIT License
453 stars 51 forks source link

Firefox display: -moz-box unnecessary? #36

Closed kaspar-allenbach closed 9 years ago

kaspar-allenbach commented 10 years ago
.m-pikabu-viewport {
    backface-visibility: hidden;
    display: -moz-box;
    overflow: hidden;
    position: relative;
    transform: translateZ(0px);
}

This behaves very strange in firefox. The pikabu-viewport doesn't span the overal width of the browser viewport. If I disable display: -moz-box;it works well.

kpeatt commented 10 years ago

Hi @Seppentoni,

Thanks for reporting this! It's definitely something we're aware of — the reliance on flexbox has actually been removed in the latest development version. We've got a big new version release of Pikabu planned over the next little while. In the meantime, I'd encourage you to use the development branch (https://github.com/mobify/pikabu/tree/development).

Do you mind if I ask what project you're attempting to use this on? Also, please let us know if you run into any more problems — we've probably encountered a few of them and are more than happy to help out.

(Dupe of #18)

kaspar-allenbach commented 10 years ago

Hi I'll use it here: http://ebas.info/de/ I noticed another bug. If I reside the viewport, the scrollbar disappears?? Is that fixed in the development branch?

Anyway. I'm gonna implement the development branch and see whats happening. Cheers.

kpeatt commented 10 years ago

@Seppentoni I think you should be able to get around that issue by setting

.m-pikabu-viewport {
    overflow: visible;
}

in any media query that doesn't use the pikabu menu. We built pikabu for Mobify's usecase which doesn't include responsive media queries so it doesn't currently account for that. I'll make a note to ensure that usecase is considered for our next version.

bohnna commented 10 years ago

I was having this same issue, using the developmental branch cdn css file. I switched to display to "flex". Is that appropriate? I'm not too familiar with flexbox.

kpeatt commented 10 years ago

Hey @bunzrok, display: flex will likely work for you here with newer versions of Firefox. You don't actually need to set flex on this — it was a vestigial leftover where we were trying to save some lines. Removing it should work just as well.