[HTML/CSS]jquery.customSelect.jsのバグ？対処のメモ

jquery.customSelect.jsを使ったセレクトボックスを、text-align:center;で中央寄せすると、IE11環境のみでクリック選択できなくなります。
画面左端の空間をクリックするとなぜか選択できます。
解決方法は、text-align:center;を使うのを止めることです。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無題ドキュメント</title>
</head>
<body>
<style type="text/css">
.customSelect {
	border:solid 1px #333;
	padding:10px;
}
div {
	text-align:center;
}
</style>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/jquery.customSelect.js"></script>
<script>
$(function(){
    $(".customSelect").customSelect();
});
</script>
<div>
  <form>
    <select class="customSelect">
      <option value="">customSelectのセレクトボックス</option>
      <option value=""></option>
      <option value=""></option>
    </select>
  </form>
</div>
<div>
  <form>
    <select class="">
      <option value="">標準のセレクトボックス</option>
      <option value=""></option>
      <option value=""></option>
    </select>
  </form>
</div>
</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>無題ドキュメント</title>

</head>

<body>

.customSelect {

border:solid 1px #333;

padding:10px;

}

div {

text-align:center;

}

</style>

$(function(){

$(".customSelect").customSelect();

});

</script>

<div>

<form>

<option value="">customSelectのセレクトボックス</option>

</select>

</form>

</div>

<div>

<form>

<option value="">標準のセレクトボックス</option>

</select>

</form>

</div>

</body>

</html>

追記
上記コードで再現しないことがあります
原因が特定できていません

[確認環境]
Windows 7 SP1 64bit
IE 11.0.9600.17843

jquery-1.11.1.min.js
http://jquery.com/download/

jquery.customSelect() – v0.5.1（2014-03-19版、2015年7月30日現在の最新バージョン）
http://adam.co/lab/jquery/customselect/

この記事を書いた人

yellow

パズルファクトリー制作ノート

この記事を書いた人

新着記事

Practice is better than precept.