Filament Group published a workaround for a bug in Safari for iOS that causes a user-zoomable page to scale beyond the width of the viewport when the device’s orientation changes from portrait to landscape. You can read about it in their blog post, A Fix for the iOS Orientationchange Zoom Bug.
For those creating WordPress websites that need to be iOS friendly, I’ve created a plugin that implements the workaround.
iOS Orientation Change Bug Workaround WordPress Plugin (3.16 KB)
Adding settings for your iOS app so that they appear in the Settings app is simply done by creating a settings.bundle and defining the groups and settings controls in the Root.plist in the bundle. Sometimes it’s helpful to add hints and extra information by adding footer text to groups. Unfortunately it’s not clear how to add the footer text from the interface Xcode provides for the settings.bundle Root.plist.
Here’s how to add footer text to a group in a settings.bundle.
Title and Type. Stack Overflow – Is it possible to add info or help text to an iPhone settings bundle?
Now that you have iOS 5 installed, you should probably learn how to make the most of it. I’m compiling a list of all the tips and tricks related to iOS 5 that I find and I’ll keep updating as I discover more.
To display Notification Center, slide your finger down from the top of the screen when on the home screen or in an app. Touching a notification will open the corresponding app. Notifications for an app can be cleared by touching the “X” at the top right of the section and then touching the “clear” that appears.
On the lock screen, you can unlock and open the corresponding app for a notification by sliding the app icon to the right.
To manage what and how notifications are displayed in Notification Center, go to Settings app > Notifications. You can configure which apps use Notification Center, what order they are listed in Notification Center and how each apps display their notifications as they are added.
Reminders is a brand new app for maintaining a to-do list. Items can trigger reminders based on time or location (arriving or leaving).
To unlock and open the camera app quickly from the lock screen, double press the home button and touch the camera icon that appears to the right of the slide lock.
You can now use the volume up button to take photos or start/stop video recording.
Safari now supports private browsing. To enable private browsing, go to Settings app > Safari and turn on Private Browsing in the Privacy section.
To set up your Twitter account, go to Settings app > Twitter and enter your Twitter username and password or create a new account.
Twitter is integrated with many of the standard apps. For example, you can now share locations via Twitter in Maps and share links via Twitter in Safari.
The Weather app now supports Local Weather. When enabled the left most view will display the weather based on your current location.
Also newly added is hourly weather. Touching the top section of the view will toggle the hourly weather on and off.
You can now add custom keyboard shortcuts which allows you to enter a long regularly used phrase by only typing short string of characters. The example that is already created by default is “On my way!” which can be entered by typing “omw”. To manage keyboard shortcuts, go to Settings app > General > Keyboard and touch the Edit button.
I’m making some changes. I’m ditching the pre-made WordPress theme and creating my own custom theme based on Roots. I’ll also be retiring the blog subdomain and making this the new benwong.me. There will probably be many other changes too. So please excuse the mess while all this is happening.
position: relative doesn’t work for <td> in FirefoxWhile working on a new page for a client this morning I discovered that relative positioning doesn’t work for td elements in Firefox. The page required a three column grid of products and on the bottom of each product cell would be a “buy” link. So, logically I decided I needed to do the following:
position: relative on the td for product gridposition: absolute and bottom: 0 on the “buy” linkIt worked in Safari, Chrome and even IE. But failed in Firefox to my dismay – the “buy” link appeared outside the cell it should have been in, along the edge of the browser window. A quick Google search showed that it’s a known issue.
Here’s my solution to the problem:
td in a divposition: relative and height: 100% on that divHere’s a web page with examples of the problem and the solution.
Update: It seems this solution has issues when cells in the table row have varying heights. I’ll need to spend some time experimenting.
Ben Wong is a freelance Web/iOS Developer from Brisbane, Australia. He builds web sites, ASP.NET/SQL Server web applications and apps for iPhone. more
