Home >> Tutorials/FAQs >> CSS Tutorials >> Index

CSS Tutorials - Setting Page Width to a Fixed Value

By: FYICenter.com

(Continued from previous topic...)

How To Set Page Width to a Fixed Value?

If you don't want your page to be resized when browser window is resized, you need to set your page width to an absolute value.

Many Webmasters use TABLE tags to set page width to a fixed value. But it is actually easier to use DIV tags and CSS definitions to set your page width to a fixed value. All you have to do is to insert a DIV tag right after the BODY tag, and set a width this DIV tag, as shown in the following HTML document:

<style type="text/css">
  DIV.page {width: 7.0in}
</head><body><div class="page">
<H1>Page with Fixed Width</H1>
<p><script language="JavaScript">
  for (i=0; i<100; i++) {
    for (j=0; j<10; j++) {
      document.write(j+' ');
<p align="right">By FYICenter.com</p>

If you save the document as fixedLayout.html, open it and resize the browser window, the page size will not change as shown below:

(Continued on next topic...)

  1. What Needs To Be Considered When Designing Page Layout?
  2. What Is Screen Resolution?
  3. What Is Browser Resolution?
  4. How To Test Browser Resolutions?
  5. How Wide Do You Want Your Page Content to Be?
  6. What Are the Page Widths on Popular Websites?
  7. What Are the Length Units Used in CSS?
  8. How To Set Page Width Relative To the Browser Width?
  9. How To Set Page Width to a Fixed Value?
  10. How To Center Your Page in Browser Windows?
  11. What Happen to Images with Absolute Page Width Units?
  12. How To Set Page Widths to Relative Length Units?
  13. What Happen to Font Sizes with Relative Page Width Units?
  14. How To Set Font Sizes to Relative Length Units?
  15. What Are the Background Style Properties?
  16. How To Specify a Background Image?
  17. How To Position Background Images?
  18. How To Specify Two Background Images on a Page?

Selected Developer Jobs: