Controlling Page Margins | HTML & XHTML: The Complete Reference (Osborne Complete Reference Series)

< Day Day Up >

Under many browsers, the body element includes attributes for setting page margins. Internet Explorer and Netscape take different HTML-based approaches to setting margins. Under Internet Explorer, there are two primary <body> attributes that affect margins: leftmargin and topmargin . Each is set with a pixel value. For example, leftmargin="25" creates a margin of 25 pixels between the left edge of the browser window and its content; topmargin="15" creates a 15-pixel margin between the top of the browser window and its content, as well as at the bottom if the content extends that far. Under Netscape, use marginheight and marginwidth and set to similar values like so:

  <body topmargin="15" leftmargin="15" marginheight="15" marginwidth="15">

Note	Microsoft Internet Explorer also supports the use of bottommargin as well as rightmargin attributes for the body element, though they are rarely used. See Appendix A for more information on these and other Internet Explorer proprietary changes.

Most often, designers want to turn off all margins in order to bleed content, particularly to the edge of the browser screen. In HTML, this could be done using the following attribute values in the <body> tag:

  <body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">

Of course, this approach to layout will be alleviated with style sheets. A simple rule in the <style> block found in the <head> of a document like so

  <style type="text/css">  <!-- body    {margin: 0px;} -->  </style>

would also remove margins and should work under all CSS-compliant browsers. Both could be used just to be sure the margins are removed, even in older browsers.

Although many of the elements and attributes discussed in the last few sections are useful to control the layout, color , and background of a page, many of them are browser-specific or are deprecated under HTML 4 and XHTML, so you won't get cleanly validatable markup using many of these techniques. The goal should be to eventually provide this function solely with CSS. However, until all the problems with style sheets are worked out and browsers are upgraded for backward compatibility, as shown by the previous example, it might be necessary to use both layout forms for some time.

< Day Day Up >