Skip to content
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

Jump to bottom

Fixes a couple of typos. #21

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

Fixes a couple of typos. #21

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.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 2 additions & 2 deletions _posts/2015-08-07-css-responsiveness.md
View file
Open in desktop
Expand Up @@ -207,7 +207,7 @@ The `@2x` suffix is just Apple's notation for Retina images, and has been adopte

Usually, you want to focus on the full width **desktop** version first, as it features a more complex design that includes columns, hover states, absolute positioning, floats etc.

But designing the **mobile** version first is actually _easier_ considering a **["HTML is almost 100% responsive out of the box"](http://fluidity.sexy/)**. Most web designs on mobile are only focusing on vertical layouts, with no or very few columns, because scrolling is **natural** on mobile devices.
But designing the **mobile** version first is actually _easier_ considering **["HTML is almost 100% responsive out of the box"](http://fluidity.sexy/)**. Most web designs on mobile are only focusing on vertical layouts, with no or very few columns, because scrolling is **natural** on mobile devices.

Using [the Flow](/css-the-flow.html) is straightforward to design a mobile site: just order your HTML elements in the way you want them to be displayed. Simply by writing your HTML code, you're _already designing your mobile website_. Header first, menu afterwards, then your content, and a footer at the end. _Voilà_!

Expand All @@ -232,7 +232,7 @@ body{ }
}
{% endhighlight %}

A desktop-first approach starts with styles for large screens and `min-width` media queries in order to apply specific rules for larger viewports:
A desktop-first approach starts with styles for large screens and `max-width` media queries in order to apply specific rules for larger viewports:
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for noticing this. I guess larger viewports needs to be changed to smaller viewports then?


{% highlight css %}
/* General CSS rules for every viewport, including large desktop screens */
Expand Down