CSS: Create iOS style Pin Password box

Question

I want to create a html5 input that looks like the iOS enter Pin (on the lock screen).... with 4 input boxes.

How do i achieve this?

Answer 1

No need for jQuery, much cleaner IMO.

HTML

CSS

form#ios input[type=password]{
    height: 50px;
    width: 40px;
    text-align: center;
    font-size: 2em;
    border: 1px solid #000;
} 

Demo

http://jsfiddle.net/jerryhuangme/e9yhr/