Select by clicking on all IE’s

Asked

Viewed 74 times

1

I am having a problem, that in all versions of Internet Explorer, when clicking on a select, it automatically closes when moving the cursor, without the possibility of choosing one of the OPTIONS:

inserir a descrição da imagem aqui

   <form action="/pesquisar" name="formpesqf" method="POST" class="form-search form-private">
        <div class="input text">
            <label for="text">Nome do produto ou referência</label>
            <input type="text" name="textfield" id="text" class="f field-top" title="Nome do produto ou referência" placeholder="Nome do produto ou referência" />
        </div>
        <input type="submit" name="buton" value="Pesquisar" class="btn-search fleft transition" />
        <div class="input select">
            <label for="grupo">Buscar por grupo:</label>
            <select name="grupo" class="sel-header" onChange="submit();">
                <option value="">Selecione</option>
                <!-- BEGIN BLOCK_SESSAO_FLUTUANTE -->
                <option value="{value_ses}" {SELECTED_GRUPO}>{text_ses}</option>
                <!-- END BLOCK_SESSAO_FLUTUANTE -->
            </select>
        </div>
      <div class="input select">
           <label for="marca">Buscar por marca:</label>
           <select name="marca" id="marca" class="sel-header" onChange="submit();">
               <option value="">Selecione</option>
               <!-- BEGIN BLOCK_MARCA_FLUTUANTE -->
               <option value="{value_mc}" {SELECTED_MARCA}>{text_mc}</option>
               <!-- END BLOCK_MARCA_FLUTUANTE -->
           </select>
      </div>
   </form>

.sel-header {
    margin: 0;
    border: 1px solid #CCCCCC;
    height: 40px;
    background-color: #fff;
    padding: 0 15px;
    width: 170px;
    cursor: pointer;
}

.form-private .f,
.form-private .sel-header {
    font-size: 14px;
    font-family: arial, sans-serif;
    color: #999999;
}
.form-private .btn-search,
.sel-header,
.form-private .f {
    -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
            border-radius: 5px;
}
.form-private .f:hover {
    height: 26px;
    width: 327px;
}
.form-private .f:hover,
.form-private .sel-header:hover {
    border: 2px solid #62A639;
}
  • 4

    Sorry but.. what? o. The

  • I have the select above, click to expand the options, and when trying to choose one, select simply, close the.

  • This smells like hover or mouseenter being (badly)treated via Javascript.

  • That, IE = Internet Explorer, in case, based on the HTML above, both of the two selects are with this problem.

1 answer

1


In the selects Hover, I was making the following:

.form-private .f:hover {
    height: 26px;
    width: 327px;
}
.form-private .f:hover,
.form-private .sel-header:hover {
    border: 2px solid #62A639;
}

I only removed the :hovers, and the problem was fixed. : D

  • Yeah, but I didn’t have :hover none in the CSS you posted in the question!

  • I had not published this part of the code because I did not know it had something to do with this problem, I will update the question.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.