I'm making a website and how do you stop text from moving around when you resize the website? Also how to you get the background to resize by itself to match the user's screen resolution? I'm using position: absolute and pt instead of %. Is that the problem? This is |HTML and CSS.
One of the goals of the web was portability. This means the text flows. There are programs that prevent this by turning the text into an image, but then not every person will be able to view the site. In the newer standards for HTML and CSS, there are more flow controls to help limit some of the changes, but they still do not eliminate the auto sizing ability because it is simply too important for different devices and users.
As for the background, those are set size. You would need to use a script language to override that and have it resize to the user or load a different image based on what was detected.
For making background to fit viewers browser' window, need to set position to relative and set its width to 100% ... your links doesn't work, here is what you want: <html> <head> <style> #background { background-image: url("your-background.jpg"); background-repeat:no-repeat; background-size: 100% 100%; position:absolute; width:100%; height:100%; } #text { position: absolut; width:200; height:200; } </style> </head> <body> <div id="background"> <div id="text">Example text</div> </div> </body> </html>
@Enz I agree that would fit the window, but they said screen resolution, which is a different issue. Hopefully they meant what you are talking about,because that would be an easy solution. However, if they are trying to make sure that certain things are never distorted, that won't do it.
Join our real-time social learning platform and learn together with your friends!