Safari has a User Agent switcher under the ‘Develop’ menu. The Develop Menu can be enabled in Preferences > Advanced. It allows you to test your layout on Safari, IE, Firefox, Chrome, and Opera for both Mac and Windows browsers, and iOS devices.
But some User Agents are not on the list. Luckily, it is easy to add other User Agents since Safari uses a simple XML file that can be edited on test editors or GUI.
The method that we are going to use is by editing it thru GUI.
Run the following command:
sudo nano /Applications/Safari.app/Contents/Resources/UserAgents.plist
Now, you can edit the file.
Add the following code:
name Android version 2.1 platform Mac user-agent Mozilla/5.0 (Linux; U; Android 2.1; en-us; Nexus One Build/ERD62) AppleWebKit/530.17 (KHTML, like Gecko) Version/4.0 Mobile Safari/530.17
Another way to edit the XML file is by copying the plist file to Documents folder or any desired location
cp /Applications/Safari.app/Contents/Resources/UserAgents.plist ~/Documents/
Open the file and paste the code as specified above.
Then copy the edited file back to Safari:
sudo cp ~/Documents/UserAgents.plist /Applications/Safari.app/Contents/Resources/UserAgents.plist
Now, if you switch to Android as your User Agent, you can see your layout and modify its css and components inline.