Home/ Questions/Q 6164523
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T22:00:27+00:00

Pretty simple question. Its just some advice based on personal opinion and best practice.

  • 0

Pretty simple question.

Its just some advice based on personal opinion and best practice.
It’s difficult to explain so I’ll draw the best image I can.
Try to imagine that I have any old website and at the very top I have a navigation bar which is broken into 3 rows.

Top is application: Settings, Profile, Login/Out
Second is notification: Error, new message
Third is part navigation part functional.

So we have 3 rows supporting different functionality and obviously different color schemes. Each on is no more than about 5% of the total pages height.

I supposed the question I’m asking is whats the best way to do this.

First guess was to use tables to format the data and space them out:
This worked, but It looks sloppy. 

{
    border-collapse: collapse;
    border-spacing: 0;
}

seems to fill in any gaps in the table but it doesn’t look right

Second guess was to use frame sets:
Shot myself a dirty look for even thinking of it

Third guess was to keep everything css and Html
Which seems like the most sensible one next to tables but keeping content organized with the multiple buttons and such sounds like it could be trouble.

Lastly
was use a JQuery or javascript UI library. This presents It’s own set of problems but could be the prettiest if done right.

So if it was you, how would you go about doing this simple task and why?

picture of view as requested. Part in question is top nav

http://s1180.photobucket.com/albums/x406/0vertone/?action=view&current=globalview.jpg

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Don’t use tables for this purpose.

    Only use tables for tabular data (which this isn’t).

    Just use divs for the containers and lis for the menus.

    EDIT

    This is somewhat like I would do:

    http://jsfiddle.net/uf2zU/1/

    This uses elements what they are meant for.

    And can be easily controlled using CSS.

    EDIT 2

    http://jsfiddle.net/uf2zU/4/

    • 0