Forum Moderators: open

Message Too Old, No Replies

IE DOM Issue

Yet another quirk in IE

         

colandy

7:38 am on Jun 28, 2007 (gmt 0)

10+ Year Member



OK, Hi All. Hopefully someone has an answer for this coz it's driving me mad.

The following HTML code works fine in the sense that the table resizes so the first column is the size of the largest word contained in it.

<table width="100%" border="0" cellpaddin........>
<tr>
<td>Containing words</td>
<td width="140px" nowrap>Foo Bar</td>
<td width="140px" nowrap>Foo Bar</td>
<td width="140px" nowrap>Foo Bar</td>
<td width="140px" nowrap>Foo Bar</td>
</tr>
</table>

This is all great and works fine, however, as I am using AJAX to retrieve repeating data from MySQL I need to use the JS DOM to create the table. Now I know that the following code won't work in FF, but I've tried both FF & IE Compatible code and that does the same so just thought I'd use this as an example as it's shorter.

var mtbl=document.createElement('<table width="100%"...>');
var mbdy=document.createElement('<tbody>');
var mrow=document.createElement('<tr>');
var mcol=document.createElement('<td>');
mcol.appendChild(document.createTextNode('Words'));
mrow.appendChild(mcol);
var mcol=document.createElement('<td width="140px" nowrap>');
mcol.appendChild(document.createTextNode('Foo Bar'));
mrow.appendChild(mcol);
var mcol=document.createElement('<td width="140px" nowrap>');
mcol.appendChild(document.createTextNode('Foo Bar'));
mrow.appendChild(mcol);
var mcol=document.createElement('<td width="140px" nowrap>');
mcol.appendChild(document.createTextNode('Foo Bar'));
mrow.appendChild(mcol);
var mcol=document.createElement('<td width="140px" nowrap>');
mcol.appendChild(document.createTextNode('Foo Bar'));
mrow.appendChild(mcol);
mbdy.appendChild(mrow);
mtbl.appendChild(mbdy);

This all appears fine until you resize the window, the first column appears to have a fixed width and won't resize as expected.

Any idea's/work arounds would be appreciated.

colandy

8:52 am on Jun 28, 2007 (gmt 0)

10+ Year Member



Think I found the issue.....not sure how to correct it tho.

The data comes from a MySQL database and if the data for the first column is over 7 chars long it causes the scroll bar to appear. Any Idea's..?

colandy

9:32 am on Jun 28, 2007 (gmt 0)

10+ Year Member



OK now I'm Realley confused.......

Straight HTML Table, using the oringinal HTML table code.

For the first column type the Text 'Agency Name'. All Appears well resizing the window should not cause an issue. Now type 'Sanderson IT' in the first columns text. Resize causes the scroll bar to appear in IE b4 it should.

HELP!

colandy

9:45 am on Jun 28, 2007 (gmt 0)

10+ Year Member



Further info......This appears to be related to the id/class used in the cell that contains this table. I can specify that the cell needs to be centered and at the top but can't specify any font detail.

Strange but true. Think I can get round this now.....If you want to comment go ahead would be good to hear your idea's.

colandy

9:52 am on Jun 28, 2007 (gmt 0)

10+ Year Member



More Specifically using the Veranda Font causes the issue.

colandy

9:56 am on Jun 28, 2007 (gmt 0)

10+ Year Member



Opps....Spell it right u muppet......it's verdana

Yes I know it's a standard MS font, but for some reason using verdana, in a cell that contains a table that contains the text 'Sanderson IT' is not allowed according to MS IE.

Really wierd and I'd like to ask MS why this is, but sure they would have absolutely no Idea.