I'm working on this layout, and everything is alright in every browser except for Safari.

How the layout is coded is such that it requires tables with height: 100%; so that as the content dynamically extends the page further down the layout, the complex background scheme needs to follow and extend as well.

Here is what the layout is supposed to look like (as seen in Firefox):

( if you're using Firefox yourself)

And here is what it looks like in Safari:

Does anyone know how to force all the tables and cells to have a 100% height?? Please help!

- Zachary Beschler

2 answers


Opera does the same as safari (and Chrome). The inner one-cell table seems unnecessary. If you remove the inner table and apply the background image to the td.glowleft, it will automatically (with a repeat-y in the css) fill the entire height.

Answered over 7 years ago by Richard Grevers

Oh yeah, I know!'s how it's set up (I drew a little picture)

I would remove the inner table, but I require 3 backgrounds to complete the effect of the outer glow. Unless you all have a better suggestion of how I can place three backgrounds in such a fashion where:

A. The container background repeats on the y-axis underneath the child elements it will contain,

B. The child element must contain two (stationary, non-repeating) backgrounds, the first of which is nested always at the top, and

C. Where the second stationary background is always nested at the bottom of the ever-growing table.

Tables doesn't have to be the answer, but I'm fresh out of other suggestions. Frankly me and <table>s have a love-hate relationship.

Thanks to all those who have and who can still help :)

- Zachary Beschler

Answered over 7 years ago by Zachary Beschler