Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problem with 2 select elements #217

Closed
ramunasm opened this issue Dec 11, 2014 · 2 comments
Closed

Problem with 2 select elements #217

ramunasm opened this issue Dec 11, 2014 · 2 comments

Comments

@ramunasm
Copy link
Contributor

Hello,
I am trying to make a form and I am using the following code.
The problem is that when I have 2 select elements one of them seems to get expanded on page load, and the one below does not seem to work. Am I doing something wrong, or is there a bug?

        <html>
            <head>
              <link type="text/css" rel="stylesheet" href="css/materialize.min.css"  media="screen,projection"/>
            </head>

            <body>
          <form>
            <div class="row">
              <div class="input-field col s6">
                <label>Dropdown 1</label>
                  <select>
                    <option value="" disabled selected></option>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                  </select>
              </div>
            </div>
              <div class="row">
                <div class="input-field col s6">
                  <label>Dropdown 2</label>
                    <select>
                      <option value="" disabled selected></option>
                      <option value="1">1</option>
                      <option value="2">2</option>
                      <option value="3">3</option>
                      <option value="4">4</option>
                      <option value="5">5</option>
                    </select>
                </div>
              </div>
          </form>

              <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
              <script type="text/javascript" src="js/materialize.min.js"></script>
            </body>
        </html>

Screenshot showing how the page looks on page load with no user interaction
screen shot 2014-12-11 at 15 47 58

@Dogfalo
Copy link
Owner

Dogfalo commented Dec 11, 2014

This used to be a bug, #177. But it was fixed a while ago. It is likely that you are on an older release. Also you don't want the class="input-field" on your select elements.

@ramunasm
Copy link
Contributor Author

Ah, thank you! I was using the stable release, but it works with the latest files.

Smankusors pushed a commit to Smankusors/materialize that referenced this issue Jan 10, 2022
docs: rework about and home page to mention this is the community fork
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants