Skip to content

Add info for Safari #23

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
johankj wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Add info for Safari #23

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions secret/inspect-viewing-your-site-as-responsive.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ browsers:
- chrome
- firefox
- opera
- safari
categories:
- inspecting
parent: inspecting
Expand All @@ -25,3 +26,5 @@ tags:
<p class="opera">In Opera Developer Tools also you can change the width and height using 'Device Metrics' menu under 'Overrides' tab of 'Settings'.</p>

<p class="firefox">The Firefox Developer Tools include a tool to check your site in any dimension. The 'Responsive Design Mode' tool can be found in the top right header of the Developer Tools. Opening it provides you with a number of preset sizes and an option to add additional ones to cater for your needs. Firefox also provides an option to rotate your dimensions so you can test both landscape and portrait.</p>

<p class="safari">In Safari’s Develop menu, there is an Enter Responsive Design Mode menu item. (To turn on the Develop menu, go to Safari > Preferences, and check Show Develop menu in menu bar.) This will show you how the website displays on a range of iOS devices, as well as other browser resolutions. You can also choose the user agent, and choose to view your assets in 1x, 2x, or 3x.</p>