There are a lot of questions.

Layout https://imgur.com/a/yM9vMrg

  1. I have a layout size of 1600px, and a screen with a 1440px extension. How to stick such a layout in pixel perfect, so that everything is exactly at the scale of "1" (reduce to the extent of the screen or cut off indents).

  2. How to lay out such a layout on bootstrap, the grid is already built in

  • do you have the width of the entire layout 1600px? or just content? ibb.co/d1xmTd - Maks Devda
  • The size of the content is 1200px, and the indents are 200px each — Netahaki

2 answers 2

The points:

1) the entire content of which width 1200 is inserted into the wrapper and centered.

<div class="screen-one"><div class="inner-wrap>контент внутри</div></div> .screen-one { width: 100%; background: #fff;} .inner-wrap {width: 1200px; margin: 0 auto;}

and so for each block

2) content, for example, 1 block is made for the whole width with the background

3) profit

  • Thanks, but what about pixel perfect? - Netahaki
  • the central unit with content will be pixel perfect (on all screens in the center with a size of 1200 pixels), and the background will be on the sides on the full screen - Maks Devda
  • I mean the extension in the browser, I have a screen of 1440, and a layout of 1600 and 160px climbs out of the screen - Netahaki
  • but the content is 1200, the elements of screen 1 are "floating" (for example, absolute positioning) and everything will fit - Maks Devda
  • You do not seem to understand what is at stake imgur.com/a/6qCUywK - Netahaki

If I understood correctly...

Add this line (.css) to the style

transform: scale (90%);

After that, the entire layout and the entire page will be multiplied by 0.9 1600 x 0.9 = 1440 (90%)

This will solve your problem. Dig to the side of the "Change the scale of the entire page Css"

  • Unfortunately not what I need - Netahaki 6:59 pm