html - Dropdown select within my header -


i creating monitoring system , need ability select different amount of days. want styled kind of this.

previous [dropdown here] days

dropdown style

as can see there no border, want text flow if 60 days there isn't lots of space right, when 120/365 looks okay 2 digits has space on right.

what best solution this?

this html

<div class="col-md-12">     <h4>previous     <select name="" id='dayselect'>         <option disabled='disabled' selected>select day</option>              <option value="30">30</option>         <option value="60">60</option>         <option value="90">90</option>         <option value="120">120</option>         <option value="365">365</option>     </select>     days     (all agencies)</h4> </div> 

this css

  #dayselect {         width: 45px;         border: 1px solid transparent;         outline: none;     }      select {         -moz-appearance: none;         text-indent: 0.01px;         text-overflow: '';     } 

fiddle

i think

<!doctype html>     <html>     <head>        <style type="text/css">        select {         -webkit-appearance: none;         -moz-appearance : none;         border:1px solid #ccc;         border-radius:3px;         padding:10px 10px;         text-justify: auto;         text-align: center;     }        }        </style>     </head>     <body>         <ul>         <select id="sel" name="sel">             <option value="o1">50</option>             <option value="o2">100</option>             <option value="o3">1000</option>          </select>         </ul>         <div id="myselect"></div>     </body>     </html> 

Comments

Popular posts from this blog

javascript - jQuery: Add class depending on URL in the best way -

caching - How to check if a url path exists in the service worker cache -

Redirect to a HTTPS version using .htaccess -