CSS CSS Layout Basics Getting Started with CSS Layout Using a Mobile First Approach

I've finished the mobile version of my website but when I go to inspect it using my dev tools it looks different.

I really hope I can explain this well.

I've just finished the mobile version of my website. I did this by making my window as narrow as possible like Guil does to show how it will look on a mobile device as I worked on it. I haven't added any media queries yet.

During the process of making this, whenever I went to inspect it using my dev tools, it would only show it as a desktop website. No matter which phone I choose, Galaxy, iphone, tablet... it never shows the simple one column layout where everything fits perfectly on the screen. It only shows up as a huge desktop layout with one small column going down the middle.

Is this because I didn't use responsive coding? Percentages and ems?

Max S.
Max S.
4,581 Points

First of all, you need to add value in percentages and also you need to add media queries. Please don't forget to add viewport line inside <head> tag.

1 Answer

You did not use media queries that's all