rowspan problem in Internet Explorer

Hi..

I've got the following HTML code that looks fine in Firefox, but the word 'ARGHHHHHHHHHH' does not appear where expected in IE. It appears lower down than it does in Firefox, and I can't figure out why.

I will be replacing this word with an iframe, so need the positioning to be accurate.

Any suggestions?



Gareth


<table width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td rowspan="3"><img src="images/montage_01.jpg" width="157" height="130" alt=""></td>
    <td rowspan="3"><img src="images/montage_02.jpg" width="156" height="130" alt=""></td>
    <td rowspan="5"><img src="/images/spacer.gif" width="14" height="389" alt=""></td>
    <td <img src="/images/spacer.gif" width="473" height="1" alt=""></td>
  </tr>
  <tr>
    <td></td>
  </tr>
  <tr>
    <td rowspan="5" valign="top">ARGHHHHHHHHHH!</td>
  </tr>
  <tr>
    <td><img src="images/montage_03.jpg" width="157" height="129" alt=""></td>
    <td><img src="images/montage_04.jpg" width="156" height="129" alt=""></td>
  </tr>
  <tr>
    <td><img src="images/montage_05.jpg" width="157" height="130" alt=""></td>
    <td><img src="images/montage_06.jpg" width="156" height="130" alt=""></td>
  </tr>
</table>
localgarethAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
mag1c1anConnect With a Mentor Commented:
Gareth,
heres your solution:


<table width="100%" border="1" cellpadding="0" cellspacing="0">
  <tr>
    <td><img src="images/montage_01.jpg" width="157" height="130" alt=""></td>
    <td><img src="images/montage_02.jpg" width="156" height="130" alt=""></td>
    <td rowspan="3"><img src="/images/spacer.gif" width="14" height="389" alt=""></td>
    <td rowspan="5" valign="top">ARGHHHHHHHHHH!</td>
    <img src="/images/spacer.gif" width="473" height="1" alt="">
    <td height="16"></td></tr>
  <tr>
    <td><img src="images/montage_03.jpg" width="157" height="129" alt=""></td>
    <td><img src="images/montage_04.jpg" width="156" height="129" alt=""></td>
  </tr>
  <tr>
    <td><img src="images/montage_05.jpg" width="157" height="130" alt=""></td>
    <td><img src="images/montage_06.jpg" width="156" height="130" alt=""></td>
  </tr>
</table>

Regards,
Mag
0
 
mag1c1anCommented:
Hey,
You had an open <td> tag  and also a space in front of another tag like this </ td>, I fixed both the problems and you can copy they below code (your code -fixed) and try it out.


<table width="100%" border="0" cellpadding="0" cellspacing="0">
 <tr>
  <td rowspan="3"><img src="images/montage_01.jpg" width="157" height="130" alt=""></td>
  <td rowspan="3"><img src="images/montage_02.jpg" width="156" height="130" alt=""></td>
  <td rowspan="5"><img src="/images/spacer.gif" width="14" height="389" alt=""></td>
  <td></td> <img src="/images/spacer.gif" width="473" height="1" alt=""></td>
 </tr>
 <tr>
  <td></td>
 </tr>
 <tr>
  <td rowspan="5" valign="top">ARGHHHHHHHHHH!</td>
 </tr>
 <tr>
  <td><img src="images/montage_03.jpg" width="157" height="129" alt=""></td>
  <td><img src="images/montage_04.jpg" width="156" height="129" alt=""></td>
 </tr>
 <tr>
  <td><img src="images/montage_05.jpg" width="157" height="130" alt=""></td>
  <td><img src="images/montage_06.jpg" width="156" height="130" alt=""></td>
 </tr>
</table>

Cheers,
Mag.

0
 
localgarethAuthor Commented:
Hi

Thanks for spotting those errors... however, that doesn't fix the problem.

Still looks wrong in IE, but fine in Firefox.

I'm pretty sure its a rowspan thing, but can't figure it out.

FWIW, it also looks fine in Dreamweaver in design view.


Gareth
0
Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to Squarespace.com and use offer code ‘EXPERTS’ to get 10% off your first purchase.

 
COBOLdinosaurConnect With a Mentor Commented:
Having looked at yor grading history I'm not real interested in participating, other than to let you know you might as well go back to the drawing board right now because you are not going to get IE and Moz based browser to render that the same.  

Get rid of the table and learn CSS is you want it to work.  

Now I will leave this to other experts who don't mind sub-standard grades to walk you through what will probably be an exercise in futility.

Cd&
0
 
mag1c1anCommented:
COBOLdinosaur, I dont fully understand what you mean as I am totally new to EE (this post to you is my overall 3rd post...) mind clarfying a bit please?

Thanks,
Mag
0
 
localgarethAuthor Commented:
COBOLdinosaur - Thanks for the suggestion of using CSS... I'll have a look at that.

With regard to grading history, what grades I have awarded experts that have answered my other questions is of no relevance to this question, and of no indication to the grade I may award on this question.

When grading I always try to be fair... giving 'A' to everyone may look pretty, but wouldn't help other community members objectively evaluate an experts rating. This question is worth 500 points, and the expert that provides a solution to this problem will be awarded these points.



Gareth
0
 
localgarethAuthor Commented:
Mag... almost there! :-)

Your solution is just about right, except the line...

<img src="/images/spacer.gif" width="473" height="1" alt="">

.... needs to fix the length of the "ARGHHHHHHHHHH!" cell.

Does that make sense?

Thanks


Gareth


0
 
COBOLdinosaurCommented:
mag1c1an,

A lot of us who have been on the site for a while don't care to waste a lot of time on questioners who do not value or appreciate or volunteer work enough to grade fairly most of the time I just ignore questions from them, but when I see tables being so misused where a CSS approach is a no-brainer I just have to say something.

Cd&
0
 
mag1c1anCommented:
Cd&, thanks, new here and even made the mistake of putting my website in my posts then found out its against the rules....and cant find a link to edit that :-( anyway....

Gareth, not really, can you explain that please?

Cheers,
Mag
0
 
localgarethAuthor Commented:
Mag

I managed to work around this by creating extra tables... it's messy, but seems to work okay in all recent browsers.

<table width="100%"  border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td><table width="100%"  border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td><img src="images/montage_01.jpg" width="157" height="130" alt=""></td>
        <td><img src="images/montage_02.jpg" width="156" height="130" alt=""></td>
        <td rowspan="3"><img src="../images/spacer.gif" width="14" height="389" alt=""></td>
      </tr>
      <tr>
        <td><img src="images/montage_03.jpg" width="157" height="129" alt=""></td>
        <td><img src="images/montage_04.jpg" width="156" height="129" alt=""></td>
        </tr>
      <tr>
        <td><img src="images/montage_05.jpg" width="157" height="130" alt=""></td>
        <td><img src="images/montage_06.jpg" width="156" height="130" alt=""></td>
        </tr>
    </table></td>
    <td valign="top"><table width="100%"  border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td><img src="../images/spacer.gif" width="480" height="1" alt=""></td>
        </tr>
      <tr>
        <td>EVENTUALLY!</td>
        </tr>
    </table></td>
  </tr>
</table>

Thanks for your help anyway, and you still get the points :-)

I guess I should really learn CSS, but for now this messy workaround is okay.


Gareth


0
 
mag1c1anCommented:
Hey,

YEAAA, my first points and an "A" to boot!!!

I now see what you meant about the image controlling the space for the "arrgh", I think I would have gotten it if you showed me the actual images, its hard to understand with the placeholders.

I'll have a look at the code a bit later and see if I can get it a bit cleaner than you.

Dont feel too bad about the CSS thing, I have been webmastering for a looong time and have created over 47 sites but still I use as little CSS as possible because netscape 4 and a lot in that line of browsers have a problem with CSS, tables->no problem plus its not really good to argue with the visitor and tell them to upgrade :-)

Have a nice one,
Mag
0
 
localgarethAuthor Commented:
Thanks for the tips Mag... this is only my second web site, and its hard to know the best way of doing things.

Many thanks.


Gareth
0
 
mag1c1anCommented:
Most welcome, this is a pretty nice place since we can help each other out, I just discovered it coz I was bored. :-)
If you are new to HTML/webmastering/programming check out my profile in a day or two as I will be adding a couple of links where you can learn quite a bit of stuff that will jumpstart you...not just html but mostly server side scripting like (my favourite) PHP (I come for a c, c++, perl, java background)

See you around!

-Mag
0
 
ZylochCommented:
Mag, glad to have you here, and you're right, you learn lots from here, especially if you participate in answering questions (believe it coming from someone who leanred 75% of my web knowledge from ee)

Regards,
${Zyloch}
0
 
mag1c1anCommented:
Hey Zyloch,
Thanks for the welcome.
Yeah, I know how frustrating it was when I start building my first sites so I like helping starting out webmasters or people in general.
Who knows, maybe i'll qualify for a premium membership soon :-) but dont know if I'll actually use it because I pretty much program in PHP now and have pals to help me when things go wrong, should be fun anyway.

Cheers,
Mag
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.