As the web grew and grew, there was demand for more control over page layout. One desire was to format text so that it could be aligned to the center of a page, rather then just justified to the left margin.
The desire for this was strong enough that the makers of NetScape brought out a new tag which centered everything, this tag is :
<center>...............</center>
There is also a modification of the <p> command which can give the same effect as the <center> command this is :
<p align=center>...</p>
Notice how the <p> command is used with a closing </p> tag. Also if you are aligning several paragraphs using the <p> tags,each one will have to be marked with a separate <p align=center>...</p> There is also another few functions of the <p> tag, this is the aligning of text to the left or right of the screen. For example:
<p align=left>...</p>
<p align=center>...</p>
<p align=right>...</p>
Most other browsers and the HTML 3.2 standards now support NetScape's
<center>...</center> tags.
Headers also have the ability to be aligned differently, this can
be done using this commands :
<hN align=left>...</hN>
<hN align=center>...</hN>
<hN align=right>...</hN>
Where N is the heading numbers between 1 and 7. There is also an alignment function for the <hr> tags. It works in the same manner that the above tags work, the code for this is :
<hr align=left>
<hr align=center>
<hr align=right>
With the <hr> tags, all of the other functionality of the <hr> tags still apply, I could have just as easily written the above code as, <hr width=60% align=right> to produce a different result.
In an earlier lesson, you learned how to put images on to your pages and saw that you could have one line of text align with the bottom, the middle, or the top of an image. However, up to now, you could not have a block of text sitting side by side with an inline image.
With the align attribute added to the <img> tag, it is now possible to specify to have the image itself aligned to the right or left margin of the page. But more so, any HTML following it "fill" in around the empty space. The HTML to do this is:
<img src="filename.gif" align=right>
<img src="filename.gif" align=left>
One more thing to note. There will be times when the text or other items that are aligned with an image are rather short and you want to force the next text to jump down below the image. There is an attribute for the <br> tag to clear the alignment, these are :
<br clear=left>
<br clear=right>
<br clear=all>
that will "clear" any preceding alignments set up in the <img> tags. It is suggested that you always use these tags because the alignment will vary depending on the font specified in the reader's web browser and the width of their browser window.
<div align=center>More text and text and text</div>
<div align=right>Far too much text and text and text</div>