I have three questions:

  1. How to set the height of the cells in a way other than using "line-height" ? I can't find a way to do it other than by using "line-height," and that screws things up when my text is longer than one line and wraps. I think I've tried margin and padding, without luck, but perhaps I'm not doing it right.
  2. How to set the width of the cells so that they will start at a specific designated width for the top visible navigation cell, but automatically assume a wider width as necessary to accommodate the longest string of text when a user clicks on that top cell to reveal the sub-menu choices below, as in your example here: http://csswizardry.com/demos/css-dropdown/ ?
  3. How to display menu items towards the bottom of the stack that get cut off by the page height of the browser window?

I'm wondering if there are aspects of my code and style sheets that are throwing things off, or aspects of the surrounding <DIV> tags that are throwing things off.

Here is my initial page where I use line-height (at 290% !) to set the height:

This above page shows the look I am after in terms of cell-height.

And here is the page where I set the line-height to something more reasonable (140%) and attempt to set the cell height as 70px:


I used a blue background color for what is essentially the "wrap" div, to show you what is going on. I can't seem to set the height of the cells any more than the height of the actual font.

Can you offer me any clues, given my HTML file and the CSS files I am using?

Many thanks!