Border problem

Hi,

The code below should create two columns: the first one 110 pixels width, the second one 490 pixels. This way the text would be on the left hand side of the background border. But the first cell is only about 10 pixels width.

I have  put &bsp; in the first cell, and don't want to place an image or something else here. How can I make this cell 110 pixels width?

You can also view the page online:

http://www.intelcities.com/Oakwood_Drive/jeffrus/test.html


Thanks

------------

<html>
<head><title>Test</title>
</head>
<body background="border.gif">
<table width=600 cellpadding="0" cellspacing="0" border=0>
<tr><td rowspan=2 width=110 valign=top>&nbsp;</td>

<td width="490" valign=top>
<table width="490" cellpadding="3" cellspacing="0" border="1">
<tr><td bgcolor="#FFFFCC" width="490">

<font size="2"><b>
<a href="link">Link</a> | <a href="link">Link 2</a> | <a href="link">Link 3</a> | <a href="link">Link 4</a></font></td>
</tr></table>
</td></tr>
<tr><td valign=top>
&nbsp;<br>

Bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,<p>
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,


</td></tr>
</table>
</body>
</html>
RusAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

chewymonCommented:
Try this.  I removed one of the nested tables.  It shows a little differently in IE5 and Netscape4.7, but everything is in the right place.  You might have to accept a compromise due to the difference in the way the browsers render tables.

<HTML>
<HEAD>
<TITLE>Test</TITLE>
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</HEAD>

<BODY bgcolor="#FFFFFF" background="border.gif">
<TABLE width=600 cellpadding="0" cellspacing="0" border="0">
  <TR>
    <TD rowspan=2 width="150" valign=top>
      <p><IMG src="1x1.gif" width="1" height="1">
    </TD>
    <TD bgcolor="#FFFFCC" width="490" valign=top> <FONT size="2"><B> <A href="link">Link</A>
      | <A href="link">Link 2</A> | <A href="link">Link 3</A> | <A href="link">Link
      4</A></B></FONT></TD>
  </TR>
  <TR>
    <TD valign=top> &nbsp;<BR>
      Bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
      bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
      bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
      bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
      bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
      <P> bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
        bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
        bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
        bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
    </TD>
  </TR>
</TABLE>
</BODY>
</HTML>
0
Nathan Stanford SrSenior ProgrammerCommented:
I have an answer... the way I do it is include a picture that I have created in photoshop, If you don't know how I can send you one.  The picture is only one pixel high and one pixel wide.  Then when you say how wide the picture should be in the html you say a width=110  the picture is a 1x1 gif with a transparent dot.

0
gramdeeCommented:
There are at lease three ways to solve your problem:

1) reformat table (excluded nested ones)
2) include in the empty cell the transparent 1x1 gif image with
<img src=empty.gif width=110>
3) or in common:
never set the unneccessary sizes for the table cells, cause in most cases it causes serious problems.
According to the last point I including the HTML code, which should solve your problem (it is absolutely the same as yours except the width setting).

If you need more details for points 1 and 2 don't hesistate to ask me, and I'll send you the pieces of code.

<html>
<head><title>Test</title>
</head>
<body background="border.gif">
<table cellpadding="0" cellspacing="0" border=1>
<tr><td rowspan=2 width=110 valign=top>
&nbsp;
</td><td valign=top>
<table width="100%" cellpadding="3" cellspacing="0" border="1"><tr><td bgcolor="#FFFFCC">
<font size="2"><b><a href="link">Link</a> | <a href="link">Link 2</a> | <a href="link">Link 3</a> | <a href="link">Link 4</a></font>
</td></tr></table>
</td></tr>
<tr><td valign=top width="490">
&nbsp;<br>

Bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,<p>
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,
bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla, bla,

</td></tr></table>

</body>
</html>

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
RusAuthor Commented:
Thanks gramdee :)

Thank you too nathans.. you were the first to suggest the transparent imagel solution. However, on some sites I notice that images don't show up the first time one loads the page. The second time they do. I am not sure what the reason is for this (perhaps time-out). That is why I am hesitant to use the transparent image option.

chewymon, sorry don't like this solution because there is no border around the table (which I think looks better).

Jeff
0
RusAuthor Commented:
Thanks gramdee :)

Thank you too nathans.. you were the first to suggest the transparent imagel solution. However, on some sites I notice that images don't show up the first time one loads the page. The second time they do. I am not sure what the reason is for this (perhaps time-out). That is why I am hesitant to use the transparent image option.

chewymon, sorry don't like this solution because there is no border around the table (which I think looks better).

Jeff
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.