Navigational Map Nav Reference 5.3 

5.3 Logo Division Explained

Browsers will render the images to the left, based on the "text-align: left;" statement in the .logo section of the CSS file.

The images in our example are the first items to render, they will be placed near the top of the screen adhering to the margins defined in the .logo section of the CSS.

Width and height for an image are defined inline in the XHTML.

The .logo class defines the style for the section between the <div class="logo"> and </div> tags in the XHTML code, but can be used anywhere you want this style placed-- there is no definition before the period, so it is useable on any element.

The margin, padding and border definitions are to provide consistency from browser to browser, and need to be present for interoperability. Any style used for a div needs a border of at least 1px, even if it isn't seen. Without this, older browsers can render the code irratically. The margin and padding need to be present also, even if the value is 0.

You will also notice that I don't use tables for layout. Tables are for tabular data, and there isn't any in this tutorial. Link to more information about use of tables.  

<-- Previous Page - Nav Map - Next Page -->