Small b Systems blog

Information for small businesses

Use Javascript to Center a Web Page

Home Page

SmallbSystems.com web site was originally written using the margin-left and margin-right setting of auto to center it's pages. It worked as expected under Explorer 7 and Firefox 2. We could not get it to work correctly in Explorer 8 and Firefox 3 so we went back to basics.

In the old days before word processors, we took the width of a page and subtracted the width of the text and then divided by two and set the left margin to that number. Example: Left Margin = (Window Width - Fixed Design Width) / 2

Your web document needs a Block <div>Tag within the <body> tag. We gave ours an Id of Container. The two columns are floated left and right. The ChangeLeftMargin functions is called by <body onload="ChangeLeftMargin()">

Here is part of the code:

<script type="text/javascript">
<!--
function ChangeLeftMargin()
{
UserWidth = window.screen.width;
setWidth = (UserWidth - 700)/2;
StringSetWidth = setWidth + "px";
document.getElementById("container").style.marginLeft = StringSetWidth;
}
-->
</script>
<!-- #EndEditable -->
</head>

<body onload="ChangeLeftMargin()">

<!-- Begin Container -->
<div id="container">

About the author

My name is Paul Steinberg and I am the owner of Small b Systems. I am 71 years old and have been working with computers for 32 years. I have been designing business and manufacturing systems for 49 years.

A system is a collection of orgainized tasks which guide an operation to a predictable conclusion. Unlike an individuals's routine, a system can be used by anyone.

I have worked on Wall Street, in military electronics, retailing, professional photography, manufacturing, barter and woodworking. I have designed systems in all of these industries.

Sign in