Uncentered responsive web design

I had many years of experience working with html / css, and I just recently started digging in a strange world. I bought a book, read many textbooks, but something pushed me. I have not yet found one example that does not use margin: 0 auto for the base container of the website (for the center of the site). They, for example, all use:

width: 90%; margin: 2% auto; 

What I'm trying to do is make a site that does not center the main container, but simply aligns it to the left. Then, for some reason, when I use a width of 96% (or even 100%) and a margin of a few percent, it does not stretch to the right end, as usual, so there is always a larger margin to the right of the viewport.

Am I watching something very logical?

Hooray!

+4
source share
1 answer

I'm not sure if this is the answer to your question, but maybe you can send a test case?

If this is a mobile device (iPhone ex.) That is a bugger, try adding this snippet:

 <meta name="viewport" content="width=device-width; initial-scale=1.0"> 

In addition, I advise you to use a width of 100%, and then add indents from 2 to 6% (depending on the width you are focusing on).

Here is a pretty useful link for Responsive Design (and a nice demo): http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

+1
source

Source: https://habr.com/ru/post/1398775/


All Articles