Menu icon Foundation
Ver. 5.5.2 problem with Android Chrome topbar menu and gutter

When we adjust the column gutter to zero, the top-bar menu breaks on Android Chrome (it pushes the right adjusted menu icon out of the screen).
The problem is only present on Android Chrome, it works on windows chrome (so not a chrome general issue)
We reduced the gutter both manually and thru the custom download functionality, the result is the same.
The site is this one:
http://m.tv2bornholm.dk/

5.5.2androidchromeguttertopbar

When we adjust the column gutter to zero, the top-bar menu breaks on Android Chrome (it pushes the right adjusted menu icon out of the screen).
The problem is only present on Android Chrome, it works on windows chrome (so not a chrome general issue)
We reduced the gutter both manually and thru the custom download functionality, the result is the same.
The site is this one:
http://m.tv2bornholm.dk/

Carsten Johannesen about 4 years ago

Hi Rafi
and thanks again for a prompt answer :-)

We have now confirmed that it is the Slick Slider which creates our problem, and nothing specificly Foundation related.
When the Slick slider is not engaged, the problem goes away.

FYI: It seems to be related to the Numbering dots or the next-previous buttons in the Slick component and their styling.

It is hard to locate problems when the cause and effect are not located in the same related components ;-) (the slick component "breaks" the Foundation topbar).

Rafi Benkual about 4 years ago

Top-bar does not have any padding or margin left or right be default. I tested top-bar with collapsed columns as well and couldn't replicate this on an Android device. Are you using any CSS to position the menu icon, or change the width of the bar?