Fix Button Borders in WebKit Mobile
One of the focuses of the blog redesign I've been working on is mobile support. This current blog design is passable at best when it comes to mobile display, and with mobile sales booming, I need to make sure my site is optimized for these devices. When checking my blog's comment form on the iPad, I saw this ugly border around the "Post Comment" button:
What a disgrace of a button! The light inset border is not at all what was intended. Luckily a quick CSS snippet removes the side effect:
-webkit-appearance: none;
And voila, button fixed:
Resetting the -webkit-appearance property removes the ugly border and makes my mobile buttons look exactly as my desktop WebKit buttons. Mobile development doesn't need to mean we have less control over display!
![Vibration API]()
Many of the new APIs provided to us by browser vendors are more targeted toward the mobile user than the desktop user. One of those simple APIs the Vibration API. The Vibration API allows developers to direct the device, using JavaScript, to vibrate in...
![JavaScript Promise API]()
While synchronous code is easier to follow and debug, async is generally better for performance and flexibility. Why "hold up the show" when you can trigger numerous requests at once and then handle them when each is ready? Promises are becoming a big part of the JavaScript world...
![Firefox Marketplace Animated Buttons]()
The Firefox Marketplace is an incredibly attractive, easy to use hub that promises to make finding and promoting awesome HTML5-powered web applications easy and convenient. While I don't work directly on the Marketplace, I am privy to the codebase (and so...
![Save Text Size Preference Using MooTools 1.2]()
Last time posting here I taught you how to change text-size with JavaScript. The problem with using the solution I presented as Ian Lloyd pointed out:
Increase the font size, follow a link to another web page on same site and … back...
NIce! Thanks man
What about
-webkit-appearance: button;?