I was asked today to take a look at Jimmy Reno’s Texas Hill Country Real Estate website. My first impression in one word, margin. The site loses its top margin after navigating to a few pages. Frames, tables, and no defined margin often leads to little quirks like this. So I thought I would do a quick little post today to show how to give an entire page a margin.

When navigating Texas Hill Country Real Estate using the left menu you will quickly find out the site uses frames. The left menu was left static, and the right did all of the changing. When you return to the home page though, frames are removed, and so is the margin. Yuck.

To fix something like this all that is required is a simple little modification the the body style found in the CSS file. They fortunately reference the CSS file from every page of their site so this should be an easy fix for them.

Example of adding a margin to your website:

body {margin:10 px  20px  10px  20px;}

It’s as simple as that. To know what margin width is for what side of the screen just think of it like a clock. The first attribute it for the top, the second for the right, the third for the bottom, and the fourth is the left.

If you know that the margin is going to be the same all the way around you can just use:

body {margin:10px;}

You can also simply specify. If you wanted to just add a margin to the top you would use:

body {margin-top:10px;}

An easy fix or style to use on your website.

This post is a sponsored segment on BWI

Like this post? Get website tips delivered by email straight to you. Full feed articles are delivered, and are managed by Google's Feedburner service.

One comment so far. You are next!