📜 ⬆️ ⬇️

Pro rubber layout

Inspired by this .

For those who may not know how to make everything so good.
The site should only reach to a certain size, and also to narrow to a certain value. I usually take 1500 and 980 pixels respectively.

How to do? min-width and min-height.
')
#site {
margin: 0 auto; /* max-width*/
min-width: 980px;
max-width: 1500px;
}


But IE doesn't support them. And expression loads the browser too much ... Easy, friend! I will lead you to the light from the darkness!
We write further.



And in ie.js we place

window.attachEvent('onload', mkwidth);
window.attachEvent('onresize', mkwidth);

var minwidth = document.getElementById("site").currentStyle['min-width'].replace('px', '');
var maxwidth = document.getElementById("site").currentStyle['max-width'].replace('px', '');
function mkwidth(){
document.getElementById("site").style.width = document.documentElement.clientWidth < minwidth ? minwidth+"px" : (document.documentElement.clientWidth > maxwidth ? maxwidth+"px" : "100%");
};


What is the special taste of the above method? And the fact that the minimum and maximum values ​​need to be set only in one place, well, in general.

Use, in short, to your health!

Source: https://habr.com/ru/post/19328/


All Articles