I am new at website devlopment. As a result I am testing my skills by designing a site for my High School.

I have a serious problem. When I preview my design on my computer running IE7, everything appears perfectly aligned. But once uploaded, it becomes misaligned in IEs less that my design IE7. Also same misalignment problem exists in FF.

I will appreciate any assistance for fixing this perturbing misalignment problem as shown in the link below:



There is a fundamental difference between IE behavior, and the behavior of FF and the W3C standard, when handling surrounding styles (margins, borders, and padding) for box objects of defined size.

Netscape, Firefox, and other Mozilla browsers put these styles on the OUTSIDE of the defined size of a box object.

IE stuffs the surrounding styles INSIDE the defined size of a box object.

So make the box object with a defined size, but give it NO suurrounding styles, and put other box objects inside or outside it with the surrounding styles where YOU want them.

Also, don't rely so much on plugins people don't have.