How to make a page not bug when the browser is resized?
Well, I developed a site for a school job, the problem is that when I resize the browser, the site gets all bugged, the elements leave their original positions and the site becomes impossible to move. I wanted to know how to fix this.
Normal Site:
Bugged Site:
6 answers
Just use the Media Queries for all elements and make them adapt correctly to the browser dimension.
Using the grid CSS or even the Bootstrap that also has support for grids is a good one, because you already make an adaptive layout.
You can also set a minimum width for your site using the CSS min-width: 1000px.
To learn more about this definition: http://www.w3schools.com/cssref/pr_dim_min-width.asp
I advise you to use some css framework, such as bootstrap or foundation... They are great for Responsive page development, quickly and without a headache.
The problem is that the HTML layout is not formatted to be responsive .
You can use multiple grid CSS systems to solve this problem.
Have you seen the Twitter BootStrap ? it is a set of CSS classes that you can use to make your site responsive, that is, you can use it in several dimensions and it will adapt to the resolution of the device.
From a checked, there is a short tutorial teaching how to use CSS classes.
I may even be mistaken, but from the looks of it, you must be starting to work with html/css. If the site you showed here was made with tables (which semantically is not recommended), I suggest you use absolute measures in pixels on the width and height of the cells, rather than relative measures (percentage, in and etc). Try to use fixed width for the main table or container and accommodate the elements with the widths also delimited.
Series interesting you use some kind of CSS Reset.
The recommendations posted by friends here are very valid, however, the learning curve and mastery of most of them is quite long. I advise you to study more tableless development using HTML and CSS to only then leave for the use of frameworks. Only with this you will already have a long work ahead.