1
In Firefox version 48.0, this giving error in styling the options of Select Option.
Follows the code:
<div class="buscaCodigo">
<div class="form">
<br /> <br />
<h2>Entre abaixo com o código</h2>
<form action="busca.php" method="post">
<input type="hidden" name="acao" value="buscaCodigo" />
<br /> <br />
<label>Código</label><input type="text" class="typeTextMedio" id="codigo" name="codigo" required />
<input type="submit" value="Pequisar" class="btnPesquisa" />
<br /> <br />
</form>
</div>
<div class="fechar">
<img src="_img/btn-close.png" style="width:50px;" />
</div>
</div>
<div class="buscaImovel"><br />
<h1 class="h1Centralizado">Pesquise pelo imóvel que deseja</h1>
<div style="height:10px;"></div>
<div class="divBusca">
<form action="busca.php" method="post">
<input type="hidden" name="acao" value="buscaPrincipal">
<div class="camposBusca">
<?php $tiposImoveis = $tiposDao->pesquisaTipos(); ?>
<select multiple="multiple" id="tipo" name="tipo[]" size="1" required>
<option value="Indiferente">Indiferente</option>
<?php
if ($tiposImoveis == null) {
echo "<option value=''>Não há tipo cadastrado ainda!</option>";
} else {
foreach ($tiposImoveis as $tipoImovel) {
echo "<option value='".$tipoImovel->getIdTipos()."'>".$tipoImovel->getNome()."</option>";
}
}
?>
</select>
</div>
<div class="camposBusca">
<?php $bairrosImoveis = $imoveisDao->pesquisaBairros("Muriaé"); ?>
<select multiple="multiple" id="bairro" name="bairro[]" size="1" required>
<option value="Indiferente">Indiferente</option>
<?php
if ($bairrosImoveis == null) {
echo "<option value=''>Não há tipo cadastrado ainda!</option>";
} else {
foreach ($bairrosImoveis as $bairrosImovel) {
echo "<option value='".$bairrosImovel."'>".$bairrosImovel."</option>";
}
}
?>
</select>
</div>
<div class="camposBusca">
<input type="submit" class="btnPesquisa" value="Pesquisar" />
</div>
</form>
</div>
<div style="height:15px;"></div>
<div class="alternativaEscolha">
<a href="buscaAvancada.php">
<label class="labelGrande" style="background-color:#CCC; font-weight:bold; color:#000;">Busca Avançada</label>
</a>
</div>
<div class="alternativaEscolha">
<!--abrir popUp-->
<label class="labelGrande" style="background-color:#CCC; font-weight:bold; color:#000">Busca por Código</label>
</div>
</div>
Which in firefox generates the following image:
In Chorme and IE appears correctly,
This select that goes wrong in firefox, has its stylized options also wrong.
Whereas in Chrome and IE this styling is correct:
How to solve this?
Pass the site link and I can fix it, or see about Mozilla css
– KingRider
not yet published. It would have some code that I could post that would help?
– Carlos Rocha
I understand, put the example code for me to see from the site www.codepen.io, jsfiddle.net or www.codeply.com ... want my skype?!
– KingRider
I did better, I put in another lodging I have: http://funerariasaopedro.net.br/caimoveismuriae.com.br/index.php
– Carlos Rocha
What is the version your firefox? here new version this right, it is div care of father without display and son with display, and fix father div
.divBusca { display: flex; }
and another div son.camposBusca { display: inline-flex; }
. If you are using inline-block and use parent block. Let me know and help again.– KingRider
I don’t particularly like jquery-ui, I prefer Select2 https://plugins.jquery.com/select2/ or Chosen https://plugins.jquery.com/chosen/ Maybe this one will look better in firefox
– Ivan Nack
firefox 48.0 I use. also giving error
– Carlos Rocha
reduces the text and fits
– Carlos Rocha
@Carlosrocha Hum... I’m not saying jquery-ui, it’s CSS. Already tested q passed the code? to reduce the font is beauty.
– KingRider
Already tested, gave no same. I understood to be css.
– Carlos Rocha
Try to use
vertical-align: middle
.– Bruno Wego