libs/js/jquery-mobile-1.1.0/css/structure/jquery.mobile.forms.select.css

   1 .ui-select { display: block; position: relative; }
   2 .ui-select select { position: absolute; left: -9999px; top: -9999px; }
   3 .ui-select .ui-btn { overflow: hidden; opacity: 1; margin: 0; }
   4 /* Fixes #2588 — When Windows Phone 7.5 (Mango) tries to calculate a numeric opacity for a select—including “inherit”—without explicitly specifying an opacity on the parent to give it context, a bug appears where clicking elsewhere on the page after opening the select will open the select again. */
   5 .ui-select .ui-btn select { cursor: pointer; -webkit-appearance: button; left: 0; top:0; width: 100%;  min-height: 1.5em; min-height: 100%; height: 3em; max-height: 100%; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); z-index: 2; }
   6
   7 .ui-select .ui-disabled { opacity: .3; }
   8
   9 @-moz-document url-prefix() {.ui-select .ui-btn select { opacity: 0.0001; }}
  10 .ui-select .ui-btn select.ui-select-nativeonly { opacity: 1; text-indent: 0; }
  11
  12 .ui-select .ui-btn-icon-right .ui-btn-inner { padding-right: 45px; }
  13 .ui-select .ui-btn-icon-right .ui-icon { right: 15px;  }
  14 .ui-select .ui-mini.ui-btn-icon-right .ui-icon { right: 7px;  }
  15
  16
  17 /* labels */
  18 label.ui-select { font-size: 16px; line-height: 1.4;  font-weight: normal; margin: 0 0 .3em; display: block; }
  19
  20 /*listbox*/
  21 .ui-select .ui-btn-text, .ui-selectmenu .ui-btn-text { display: block; min-height: 1em; overflow: hidden !important;
  22 /* This !important is required for iPad Safari specifically. See https://github.com/jquery/jquery-mobile/issues/2647 */ }
  23 .ui-select .ui-btn-text { text-overflow: ellipsis; }
  24
  25 .ui-selectmenu { position: absolute; padding: 0; z-index: 1100 !important; width: 80%; max-width: 350px; padding: 6px; }
  26 .ui-selectmenu .ui-listview { margin: 0; }
  27 .ui-selectmenu .ui-btn.ui-li-divider { cursor: default; }
  28 .ui-selectmenu-hidden { top: -9999px; left: -9999px; }
  29 .ui-selectmenu-screen { position: absolute; top: 0; left: 0; width: 100%; height: 100%;  z-index: 99; }
  30 .ui-screen-hidden, .ui-selectmenu-list .ui-li .ui-icon { display: none; }
  31 .ui-selectmenu-list .ui-li .ui-icon { display: block; }
  32 .ui-li.ui-selectmenu-placeholder { display: none; }
  33 .ui-selectmenu .ui-header .ui-title { margin: 0.6em 46px 0.8em; }
  34
  35 @media all and (min-width: 450px){
  36         .ui-field-contain label.ui-select { vertical-align: top;  display: inline-block;  width: 20%;  margin: 0 2% 0 0; }
  37         .ui-field-contain .ui-select { width: 60%; display: inline-block; }
  38 }
  39
  40 /* when no placeholder is defined in a multiple select, the header height doesn't even extend past the close button.  this shim's content in there */
  41 .ui-selectmenu .ui-header h1:after { content: '.'; visibility: hidden; }