Link to home
Start Free TrialLog in
Avatar of gpinzino
gpinzino

asked on

Rowspan Producing Odd Results

I am working on a web page where I want to place content in bordered boxes of varying sizes. They will be in two columns but top and bottom borders in column 1 are not supposed to line up with the top and bottom borders in column 2. I have created the attached simple web page to demonstrate the code I am using and results I get.

If you look at the attached graphic, you will see what I want and what I am getting. There’s not much to see, but if you want to see it in action, go  here.  It seems silly to have to add two more tables to get what I want.

What’s the problem here and how do I fix it?
Table-Graphic.png
test-rowspan.html
Avatar of Michael Knight
Michael Knight
Flag of United States of America image

Any reason in particular you're using <table> instead of <div> ?
Avatar of Shaun Kline
One option is to add a third column to your layout with a definition like this:
<td style="width: 0px; border: 0px; margin: 0px; padding: 0px;"></td>

However, like Michael mentioned, you should consider using divs.
Avatar of gpinzino
gpinzino

ASKER

Michael, I hope to put this into an email and I wanted to minimize email and cross-browser issues. Having never tried this before, I wanted to keep it as simple as possible so I went with a table.

Shaun, I tried your idea and it did not work in either my demo or my production page.
tables are far more restrictive than <div> lemme ask you a question in your illustration the top and bottom left boxes are not the same size is this a fixed value or could it change from time to time?
They will be a set width in the production page.
ASKER CERTIFIED SOLUTION
Avatar of Michael Knight
Michael Knight
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
to expand on my comment on <table> :
CSS 'tables' (divs) are preferable for the exact reason you stated in your original question
It seems silly to have to add two more tables to get what I want.
It solves the problem of having an infinite amount of nested tables in your layout ala FrontPage circa 2001 :) if you have any questions about the above code let me know.
Great! I'm sure I will learn a lot from your solution. Thanks for the help.