Diogo Muniz Diogo Muniz - 2 months ago 10
HTML Question

<select> list increasing height

I' m facing a doubt about using select/options in a mobile page.
After I added a list, openable with a button, the page increases height even without the activation of the list view.

I'm not sure if it is relevant, but I chosen to use the jquery css to make tests.

Here's the list code:

<div id="wrapper">
<div class="titulo">Nova O.S.</div>

<div id="novaos">
<form method="post" enctype="multipart/form-data" id="uploadForm">

<input type="text" name="placa" placeholder="Placa"/>

<div class="subtitulo">ACESSORIOS 01</div>
<div class="ui-field-contain">
<select multiple="multiple" data-native-menu="false">
<option value="aces01" name="aces01" id="aces01">3 EIXO</option>
<option value="aces02" name="aces02" id="aces02">CHAVE DE RODA OK</option>
<option value="aces03" name="aces03" id="aces03">ESTEPE OK</option>
<option value="aces04" name="aces04" id="aces04">EXTINTOR OK</option>
<option value="aces05" name="aces05" id="aces05">MACACO OK</option>
<option value="aces06" name="aces06" id="aces06">PNEUS BONS</option>
<option value="aces07" name="aces07" id="aces07">PNEUS LISOS</option>
<option value="aces08" name="aces08" id="aces08">PNEUS REGULARES</option>
<option value="aces09" name="aces09" id="aces09">RASTREADOR</option>
<option value="aces10" name="aces10" id="aces10">TACOGRAFO</option>
<option value="aces11" name="aces11" id="aces11">TRIANGULO OK</option>
</select>
</div>
<div>
<input type="submit" name="salvar" value="PRÓXIMA"/>
</div>
</form>
</div>
</div>



Answer

Add this to your #wrapper div's css :

div#wrapper {
 overflow:hidden;
 height:auto;
}

Here is a jsFiddle

Comments