By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,767 Members | 1,255 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,767 IT Pros & Developers. It's quick & easy.

restaurant menu layout

P: n/a
I have a restaurant menu to layout.

The format is item name, price, description, and possibly additional
price info (e.g., soup and salad price). I'm trying to decide how
best to use the space. I find that if I leave the width of the menu
items to auto, the layout is too spread out. If I limit the width,
then I have wasted space running along the page. I currently have the
items in 2 columns, but I'm having some trouble with certain versions
of IE/Win. I was wondering if perhaps I'm missing something. Is
there some other way I should consider doing this? Any second
opinions would be appreciated.

follow the directions in my address to email me

Jul 20 '05 #1
Share this Question
Share on Google+
1 Reply

P: n/a
Brian <us*****> wrote:
I have a restaurant menu to layout.
The menu at e.g. is quite conveniently
readable - on Lynx. It's less clear on graphic browsers. Except when printed
using your print style sheet, which creates a pretty good presentation,
though it would probably benefit from bolding the dish names.
The format is item name, price, description, and possibly additional
price info (e.g., soup and salad price).
As usual, I wish to point out that you are actually (ab)using <dl> markup
for presentational effects, rather than presenting a list of definitions
(does "$2.95 / Bowl $5.95" constitute a definition of what the term "Soup of
the Day" means?), and then encounter problems with the styling of <dl>
I currently have the items in 2 columns

And this is somewhat inflexible - it does not work well in narrow windows,
especially since there's the site navigation meny on the left.

There are various approaches to how a menu should be marked up. Instead of
<dl>, I would consider using a table - after all, it is tabular information,
with structurally similar sets of data for each dish - or, maybe more
practically if you don't prefer visual tabular presentation, a collection of
class'ed <div> elements containing headings (<h2>, with the dish names). In
the latter case, you could relatively easily make the entries boxes with a
specific width and height (in em units of course), with borders and floated
to the left, and with adequate padding and margins.

I would actually suggest the simple linear approach, i.e. the <div> way,
which makes it possible to change the appearance later, by changing just a
style sheet, in the best case.

Jul 20 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.