adjacent tables split up with content

[MaxMumford]

Hi all,

I have set up my website with tables, with columns on the left, then a center with the main content in, then another table will the content on the right. Whenever i have a lot of text in the center, the columns on the left go bigger, therefor making them look strange because of the background pics. Here is a link to how it looks:

http://www.themepics.co.uk/grafex/broken.htm

(dont worry about a few broken links to pics - this is not were i am storing the site)

how can i stop that from happening?

thanks,

Max

ps this is how it should look: http://www.themepics.co.uk/grafex/not-broken.htm

[vishesh]

You could specify width for the whole table or each column with width attribute or simply use width style property for that.

[katarey]

Hi there,

use this layout plan for rectify your problem.

http://www.justexpert.com/1a.jpg

Html code :-

<table width="95%" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#666666">
  <tr>
    <td height="117" colspan="3" valign="top"><div align="center">
        <h1>Header content</h1>
      </div></td>
  </tr>
  <tr>
    <td width="19%" height="487" valign="top"><table width="100%" border="1" cellpadding="0" cellspacing="0" bordercolor="#999999">
        <tr>
          <td><div align="center"><strong>Navigation 
              Table</strong></div></td>
        </tr>
        <tr>
          <td height="193" valign="top">&nbsp;</td>
        </tr>
      </table></td>
    <td width="64%" valign="top"><table width="100%" height="449" border="1" cellpadding="0" cellspacing="0" bordercolor="#666666">
        <tr>
          <td valign="top"><h1 align="center">Main content Table </h1></td>
        </tr>
      </table></td>
    <td width="17%" valign="top"><table width="100%" border="1" cellpadding="0" cellspacing="0" bordercolor="#999999">
        <tr>
          <td><div align="center"><strong>Navigation 
              Table/ad</strong></div></td>
        </tr>
        <tr>
          <td height="204" valign="top">&nbsp;</td>
        </tr>
      </table></td>
  </tr>
  <tr>
    <td height="102" colspan="3" valign="top"><div align="center">
        <h1>Footer  content</h1>
      </div></td>
  </tr>
</table>

Best Regards,
Rahul Dev

[MaxMumford]

Ok thanks. after posting i did pretty much that layout, and made a new editable region in the lower content, and for some reason it didnt even show up. there was text in the region, but it didnt show up in IE7 preview. This is a link to how it is now: (i made a new table, trying to have the same table cell sizes as the main table underneath so it looked like they were attatched which fixed the problem, but is very awkward to use and unelegant, especially when the window is not maximised)

http://www.themepics.co.uk/grafex/second%20table/with%20second%20table.htm

Hope this is understandable! its kind of complicated :/

thanks!

Max

[vishesh]

didnt understood ur problem well but r u talking tabt this
This website is optimized for a screen resolution of 1024x768
All content is copyright to Grafex, www.Grafex.co.uk

[MaxMumford]

FINALLY! lol iv just fixed it using that layout design. I just had to paste the main table into the cell above, and put the lower content into a new merged cell section underneath. Thanks all! Heres how it looks atm without the pics:

http://www.ThemePics.co.uk/grafex

thanks again!! Max