materialize: Dropdown Menu is not positioned correctly on the first drop (It slowly fixes itself over following drops).

Description

I have 2 drop downs next to one another in the nav-bar. The right-most one is not correctly positioned the first time it is dropped down. The second time, the position is closer to where it is expected to be. The third time the drop down renders as expected.

Repro Steps

  1. Create a nav-bar
  2. Create 2 drop downs next to one another on the nav-bar’s right content ul
  3. Hover over either drop down (it should be a bit off the screen to the right)
  4. Move your mouse away from the dropdown trigger. Once the dropdown goes away, hover over it again. (This time, the dropdown should be a bit closer to the expected location.

The dropdown continues to get closer to the expected location. In the example below, the “left” dropdown takes 2 drops to render and expected and the “right” dropdown takes 3.

###Codepen https://codepen.io/anon/pen/BZzavp

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 2
  • Comments: 26 (12 by maintainers)

Most upvoted comments

@DanielRuf I just downloaded the master branch and used the minified files from the dist folder. I can’t see a change. What is it I’m SUPPOSED to do exactly? Pull from a certain branch?

You have to recompile the files either with grunt js_compile or grunt release or another task like grunt monitor. Keep an eye on the date and time of the files. They should be in bin (and dist when using the release task).

The dist folder does not contain the latest minified files, just the minified files of the last release.

@acburst The issue is not solved yet. I have updated all source but it is still the same. Please have a look the image.

capture

This happened to me too… it appears to happen only on small and/or medium devices. I fixed it by removing the material-icons on small devices that is add a hide-on-small-only class to the material icons…