html tables

...Previous Page

Using Both Width Options Simultaneously:

    You can overcome both limitations to a limited extent (sounds redundant, but as mentioned earlier, each browser displays HTML a little differently than the next). Be creative! Experiment a lot with Tables! You'll discover that browsers adjust Table widths automatically if no width is entered. The same can be said for Cells. Here's one way to have it both ways on different parts of your page:

    • Create a blank page that contains one Table containing one Row and two columns of Cells.

     
    • Set the Table's width to zero, or don't use a width modifier in the Table Tag at all.
     
    • Set the right hand Cell's width to 200 pixels.
     
    • Set the left hand Cell's width to zero or leave it off altogether.

    The result will be that you'll be able to design the contents of the right hand Cell almost exactly as your visitors will see it (at a width of 200 pixels), but the left hand Cell width will vary with the size of the browser window. Almost the best of both worlds!

    Again, creativity and experimentation are the secrets to great Web pages that use Tables.

Table Cell Background Colors:

    Some browsers support the option of specifying different background colors for each Cell within a Table. It's fun to do and it can help to colorfully separate portions of your Web page, but there are two things to keep in mind...

    First of all, many browsers don't support this option. That could be disastrous if the browser does support text colors. For example, you might create a black Cell background on a white page, then change your text color to white so it can be seen. But if a browser doesn't support the black Cell background, your text will appear white on a white background and be invisible!

    If you use colored Cell backgrounds, the safest bet is to use a color that will contrast as well with your text as your Web page background does.

    Secondly, there's a bug in Netscape versions 3.x that prevents colored Table Cells containing HTML FORM fields from refreshing properly at times. This means that an input text box, for example, will completely disappear unless a visitor does something to properly 'refresh' it.

Side Scrolling Pages:

    This one fits under the heading of 'creative'. Don't feel limited to Web pages that only scroll vertically... there are times when horizontally scrolling Web pages are most appropriate! After all, our world is mostly horizontal anyhow...

    To create the framework for a side-scrolling page, follow these simple steps.

    • Create a new Web page with one Table consisting of one Row and three Columns of Cells.
       

    • Enter a fixed width of 1200 pixels for the Table.
       
    • Enter a fixed width of 600 pixels for each Cell.
       
    • Create a nested Table in each of the original Table's Cells. Use these for your content.

    That's it! Some of the best feedback I've ever received from visitors was a result of side-scrolling Web pages. To see a couple, take a quick look here and here. The only thing side-scrolling requires is patience!

...Previous Page

resource center

Design Basics ~ HTML Tables ~ HTML Frames ~ Java & ActiveX
The BEST HTML Tool ~ WebExpress Tutorial


WebExpress home page

Copyright © 1997 by MicroVision Development, Inc.

Vialble Software home page