Changing the css of select input menu in HTML5

We can change the Look and feel of the select input element in HTML in a very easy manner. Things that we would wish to change are the dropdown icon, the width and height of select button, the background color etc.

Here is how we do it.

1. Enclose the <select> in a <div>

<div class="select-wrapper">
    <select>
        </option value="1">Option 1</option>
        </option value="2">Option 2</option>
    </select>
</div>

2. Add following to your style sheet

.select-wrapper select { 
    moz-appearance: none;
    -webkit-appearnce: none;
    appearance: none;
    background-color: rgb(0, 133, 255);
    border-radius: 5px;
    box-shadow: inset 0 0 10px #444;
    height: 40px;
    line-height: 40px;
    padding-left: 15px;
    width: 25%;
    color: white;
    font-size: 16px
}

And you shall see a nice blue styled custom select button

Flash can soon have a co-passenger!!

Flash, after it's ship wreck fell into the abyssal plains. Waiting with such other hard-lucked passengers which fell from the ship.  But wait, we seem to have a new entrant here, its iOS programming.
Oh Yess! It is indeed iOS native code programming.

Jokes apart, iOS seems to be joining Flash in then abyssal plains because:

1. Android is the KING!!!!
2. HTML5, CSS3, Javascript based apps can do almost anything that iOS apps can.
3. These are easier to learn than Objective C.
4. HTML5 and CSS3 are cross-platform - where as iOS are not.

Why would a developer prefer to learn a new language when he can do it using what he knows. A client will mostly in his right senses invest in HTML5 and CSS3 when he can leverage these to get apps made for iOS, Android and Windows 8, rather than investing in app which would work only on iOS.

So, Flash can finally have a company with which it will undoubtedly be very HAPPY!!!!