Results 1 to 2 of 2
05-11-2007, 08:32 PM #1
using a variably resizing cell with rowspan?
I'm building a site with two columns, each that variably expands/collapses. The left column is a sidebar with collapsible sections. The right section is the main content section that grows/shrinks with the content on each page. That part was easy enough.
Then we decided that, because on most pages the sidebar was short and the content long, that it made sense to "dock" part of our L-shaped footer under the sidebar. Like this (very draft) site:
The current right column is just a testing ground. I added temporary +/- sections to allow simulating the variously sized content on different pages.
Because of the L-shaped footer, the image under the sidebar (the circle with the tree) needs to remain docked at the bottom of that column (while the sidebar content remains docked at the top). I accomplished that using rowspan and v-align for the two sub-cells in the left column.
All is working well -- with one annoying exception. When the left bar is longer than the right, the bottom-left image properly moves down and stays bottom-docked, but the left border above it gets lost and replaced with empty space.
I thought I could remedy that by using a middle cell that variously expands in hands. Something like a height=100% command. No luck.
If anyone has any suggestions, I'd really appreciate it!
05-14-2007, 12:38 PM #2
FIXED -- using a variably resizing cell with rowspan?
Well, score another for tenacity. I got the tabling fixed and it now does what I need. I thought I ought to post the fixed version (http://www.hbr.morebutter.net/joomla/rowspan-fixed.html) and offer a bit of advice I wish I took earlier.
SOLUTION: The problem was that the bottom left cell (with the image) was the cell that was expanding/shrinking. Since that cell did not have a border element (except for the one embedded in the image), when the cell would grow, the border would appear to disappear. By holding the size of that cell constant (setting the height to match the image height), it forced the middle cell to expand/contract, as I wanted.
TIP: I discovered the problem by assigning a color to the background of each cell. That helped me understand the complicated table structure and to debug. Once I assigned the colors, the problem surfaced, and the solution took 30 seconds. Next time I setup complicated tables I'm always going to start with a colored template like this one (http://www.hbr.morebutter.net/joomla/simplified.html).