How to stop html page resizing

Question

I made an HTML page with all widths and heights as a percentage, "which is the main thing for my design to work with all permissions," but when I resized my web browser, everything will get corrupted.
is there any way that when I resize my web browser I can scroll the page?

Answer 1

The only way to handle this is with a script. Take a look at other examples where people, for example, are floating the footer at the bottom of the page.

Using jQuery, you can do something like: -

<script type="text/javascript">
$(document).ready(function() { setPanels(); });
window.onresize = function() { setPanels(); }

function setPanels() {
    var windowHeight = $(window).height();
    var content1Height = $('#topDiv').height();
    var content2Height = $('#bottomDiv').height();

    // Now calculate the new splits and adjust heights
    ...

</script>

Answer 2

You can specify the min-width and min-height properties of the elements:

body      { min-width: 900px; }

, 900 , .

Answer 3

You cannot stop the end user from resizing your browser.

However, you can create your site in a fixed height / width element and then center that element on the page using CSS.

Example

#main-container {
 width: 300px;
 height: 400px;
 position: absolute;
 top: 50%;
 left: 50%;
 margin-left: -150px; /* half of the width */
 margin-top: -200px; /* half of the height */
}

I suppose you could increase the width of the browser width using JavaScript and the onresize event, but this will probably annoy your end users.