BLOG

The SUBMIT button that won't center

Browser debugging in the web design industry can be extremely challenging especially when what works in one browser may not work in another. The same holds true within Internet Explorer. Case in point, the centering of a SUBMIT button within a simple form may center in IE7 but not IE6.

For our example we used the SUBMIT button within our Contact Us page. Using valid W3C compliant code,

img.center-submit {
display: block;
margin-left: auto;
margin-right: auto }

we centered our SUBMIT button within our form. This worked fine in Firefox and Safari, however, the results varied for IE 5.5 to IE 8. IE8 and IE6 decided they wouldn't center using CSS code. IE 5.5 and IE 7 decided they would.

Frustrated by the lack of consistency between one version of Internet Explorer to another we decided to resort to a proven and trusted technique, HTML. Using the HTML command center, our SUBMIT button stayed in the middle of our form regardless of which browser we used. Thank goodness for HTML!!!

CSS still has its place, of course. We used it to colour and enhance our button. The net result is many techniques must be used in order to establish a perfect web design. Knowledge of what works when and in what scenario is imperative to a successful website.

by: Creative

«Back»