What should be done when navigation is beyond the scope of the design draft?

1, the main part of the design draft is 1200 Banner pull, but the navigation is designed according to the width of 1920 and has been full of content, my screen maximum 1440, according to the size of the design draft I can not finish the screen display, what should I do?

Mar.13,2021

Engineers cannot always think about problems in terms of implementing the requirements. Sometimes they need to consider the rationality of the requirements and then consider whether to implement or reject them. The situation mentioned by the subject should be that the designer is not professional enough and only considers the wide-screen display, so at this time the designer should be told to change the design draft.


the core question is: is your page compatible with 1440 screens?
if you want compatibility, ask the designer to produce a draft of the design on the 1440 screen.

of course, no matter whether it is compatible or not, the landlord must have at least a 1920 screen. The boss will not be so stingy, will he?


  1. isn't it necessary for the front end to fit screens of different window sizes, whether you are scaling in proportion or changing the layout
  2. chrome can resize the window. It won't be long before you transfer a 1920x1080.
  3. banner1920 body margin: 0 auto is a common layout

normally, the web page design, 1920 to 1080 is a common way of design, the design draft is no problem. What the front end needs to do is to make the layout appear consistent at all resolutions.
the main problem now is that your computer's resolution is less than 1920, at this time. You either let the boss apply to change your computer to a big screen, or adjust the resolution on your own computer, and then nav part of the width:100%, content area had better be displayed in a dynamic layout, do not write too dead.


PC web page design has a thing called content width , which is generally small in width, usually 1000 or 1200.
is designed horizontally.
if it is a large screen (such as 1920), the navigation bar is full. The content area is centered, with white space on both sides

clipboard.png

The box above can be understood as the navigation bar. The following can be understood as the content width, as you can see, the content width is not large


it is recommended to use media query. Set the width according to the screen size. If the screen is 1920, it will display normally. If the screen is 1440, it will be scaled by percentage, and the content setting will be centered.

Menu