Yo yo, So, I am trying to make a websie. I am using pictures and text. Problem: If I place the test somewhere on the site (like on a specific left% and top%) it looks completely different on other monitors. Any help?

CodePudding user response：

Depending on the monitor resolution the placement of an element on the site will be different.

A simple way to fix this would be to set a specific size for the body width and body height and center-ing the body in the HTML page.

CodePudding user response：

That should be default behaviour on phones!

Most sites need to include a line of code such as <meta name="viewport" content="width=device-width, initial-scale=1.0"> to avoid that behaviour from happening.

See Responsive Web Design - The Viewport (w3schools).

However, if you wanted to enforce the opposite behaviour, you could choose a width at which your site looks good and tell browsers to always use that. For example, if you decided on a width of 960px:

<meta name="viewport" content="width=960px">

Note: this tag goes inside the head section of your page.

An additional comment: I would recommend making your page responsive, for example using CSS @media queries.