Sign in to follow this  
Silent Dragon

[web] IE / FF difference with tables? =/

Recommended Posts

I am making a sorta home-made forum for my website and game (will be used to plan strategy with your in-game country :p) but I don't know where this is going wrong. It displays PERFECTLY in firefox, exactly how I told it to, but in IE it displays the first post correctly, but all the others it makes the box with the avatar in too big. To view it you have to register at www.silentdragon.co.uk and then clikc the forum link when you are logged in. Sorry for that. Here is the HTML version of the code thats being a bitch, i'll get a pic up in a sec so you can see the differences (i hope).
<table class="news" border="1" width="100%">
   <tr>
     <td rowspan=4 width="100" stype="width: 100px">
        <img src="users/al5858/kaze ava.jpg" width=100 height=100>
     </td>
     <td class="news_subject" height="25px">
        Posted By:
     </td>
     <td>
        al5858
     </td>
   </tr>
   <tr>
     <td class="news_subject">
        Title:
     </td>
     <td>
        Test
     </td>
   </tr>
   <tr>
     <td class="news_subject">
        Posted: 
     </td>
     <td>
        2006-09-08 20:10:25
     </td>
   </tr>
   <tr>
     <td class="news_subject" height="25px">
        Post Count
     </td>
     <td>
        Test
     </td>
   </tr>
   <tr>
     <td colspan=5 style="padding:5px">
        Just make a new thread called 'Game Suggestions' or something :p
     </td>
   </tr>
</table>









*Pic removed* [Edited by - Silent Dragon on September 8, 2006 2:33:31 PM]

Share this post


Link to post
Share on other sites
Nope. Though I've noticed that you're not giving a URL for the picture. "/silentdragon/silentdragon/mozzilaie.jpg" isn't going to cut it. You'll need http://www.whatever.com/blahblah" or similiar.

Share this post


Link to post
Share on other sites
Okay, works now. (as in the picture)

width="100" stype="width: 100px"

This looks suspicious. For one, it's "stype"? What's that? Or did you mean "style?" Another, why do you have both CSS and html definitions of what the width is? And IIRC, the HTML one will default to 100%, not 100px, though I'm definately not sure about that.

Share this post


Link to post
Share on other sites
You have the "width" attribute of table set to 100% which makes the table auto-stretch each cell to make it wide enough to fit the width of the page.

Either (a) Don't make the table stretch OR (b) Let the table stretch to 100% but set the width of the avatar cell to say 10% and the others to 45% each like so:


<table class="news" border="1" cellspacing="0" cellpadding="0">
<tr>
<td rowspan="4" style="width:10%;margin:0px;padding:0px">
<img src="users/al5858/kaze ava.jpg">
</td>
<td class="news_subject" height="25px" style"width:45%">
Posted By:
</td>
<td style="width:45%">
al5858
</td>
</tr>
<!-- ... -->
</table>



Note the cellspacing and cellpadding attributes to the <table> element as well. Even if you don't want this zero, give it some definite value so that all browsers will display it the same otherwise each browser will give this attribute it's own default value.

Share this post


Link to post
Share on other sites
Quote:
Original post by Ezbez
Okay, works now. (as in the picture)

width="100" stype="width: 100px"

This looks suspicious. For one, it's "stype"? What's that? Or did you mean "style?" Another, why do you have both CSS and html definitions of what the width is? And IIRC, the HTML one will default to 100%, not 100px, though I'm definately not sure about that.


I mis-spelt "style" I was just trygint to get it to work with style rather than simple "width" attribute. The reason I had both was also to try and get it working, I wasn't sure if IE was doing something weird and not reading the "width" attribute :p

@Verminox (and also Ezbez): Thank you for pointing out about the % thing. Changing it to a percentage rather than a px value worked perfectly =]

As for the general crappyness of my mismash of CSS and HTML is that I started out crappy (as in I didn't know any CSS when I started, let alone how to use it effectively) and so its just a hack job to get it working, then I will tidy it up and make the code nice and pretty after. That may seem the wrong way around, but I just want to get the content there, otherwise the website is rather pointless =]

Thanks again for all your help,

Al

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this