Width 100% inside MultiPage with FireFox

This post has 15 replies

Top 500 Contributor
Posts: 17
daniel1113 Posted: Wed Jun 15, 2005 @ 8:46 AM
I have been testing a page with TabStrip and MultiPage, and am puzzled by the following behavior while using FireFox. After customizing the controls to my liking, I tried creating a new PageView as follows:

<ComponentArt:PageView CssClass="PageContent" runat="server">
	
<table cellpadding="0" cellspacing="0" width="100%" bgcolor="#000000">
	<tr>
		<td style="color: #ffffff">Test Table</td>
	</tr>
</table>
	
</ComponentArt:PageView>


However, even though the width of the table inside the PageView is set to 100%, and the MultiPage control is properly rendered with a width of 100%, the test table above does not render at 100% width. As a side note, everything works perfect in Internet Explorer. Any idea why this might be?
Top 500 Contributor
Posts: 17
daniel1113 Posted: Mon Jun 20, 2005 @ 2:19 PM
Anyone? This is the only real issue keeping me from purchasing the entire Component Art Suite.
Top 10 Contributor
Posts: 6,014
stephen Posted: Thu Jun 30, 2005 @ 12:53 PM
This is actually a rendering issue with FireFox- if a table has been hidden then re-shown, it does not recalculate its dimensions. When our control loads, the pageviews are intially hidden until the scripts complete and a specific pageview is shown. Due to the above rendering issue, FireFox will not properly resize when shown. I'm afraid I'm not aware of a workaround at present, other than to use fixed sizes.

I'm sorry I couldn't be more helpful than this.
Stephen Hatcher, Developer Support Manager
Top 500 Contributor
Posts: 17
daniel1113 Posted: Wed Jul 6, 2005 @ 8:09 AM
Hey stephen,

Thanks for the reply. That makes perfect sense, and shouldn't interfere with the project I am working on. I expect that I will be purchasing the ComponentArt suite very soon.
Top 10 Contributor
Posts: 6,014
stephen Posted: Wed Jul 6, 2005 @ 2:26 PM
Thanks for your understanding, and if you need anything else, let us know.
Stephen Hatcher, Developer Support Manager
Not Ranked
Posts: 15
jackk100 Posted: Thu Aug 11, 2005 @ 8:18 AM
We came up with a workaround... add a table to the bottom of the MultiPage, set border=0 and width=100% and fill it with a bunch of &nbsp; &nbsp; &nbsp; (with spaces between to ensure wrapping occurs). We added enough &nbsp;'s to ensure at least one wrap at our expected end-user browser widths and made the font small to reduce the extra vertical whitespace it causes.

We have a little extra white space at the bottom of the MultiPage now, but that's better than the messed-up rendering we were seeing.

- Jack
Top 500 Contributor
Posts: 24
Jonas Posted: Tue Aug 30, 2005 @ 4:47 PM
We've also come up with a workaround:

We're using a treeview combined with a multipage. When the user clicks a node in the treeview to change the pageview, we have this javascript running:

    function RefreshTableSize(parentId, childId)
    {   
        var parent = document.getElementById(parentId);
        var child = document.getElementById(childId);
        child.style.width = parent.clientWidth;
    }


Where parent is the PageView object, and child is the Table object. This works like a charm in FF, Opera and IE.

Jonas
Top 10 Contributor
Posts: 6,014
stephen Posted: Fri Sep 2, 2005 @ 1:42 PM
Thanks very much for posting these workarounds, jackk100 and Jonas!
Stephen Hatcher, Developer Support Manager
Not Ranked
Posts: 10
jmercker Posted: Wed Oct 12, 2005 @ 2:40 PM
Firefox seems to not really like widths expressed in percentages in general... One thing that we've done is to use pixel widths for tables and that seems to work well overall...
Top 500 Contributor
Posts: 18
james@smartertools Posted: Tue Nov 1, 2005 @ 2:42 PM
Hey guys,

This was bugging me a bit so I fiddled. The problem is setting the display style to 'block', which Firefox apparently does not like. Firefox renders correctly when you let it use the default value, i.e. don't default it to display: none, and then set it to display: block.

So, instead of setting the display style to 'block' to show the element, set it to ''. That will cause both IE and Firefox to revert back to their default display styles.

This does indeed work flawlessly with Firefox 1.0.x and 1.5 betas, as well as with Internet Explorer 6. No idea how it will work in Opera, Safari, etc, etc.

Hopefully that will provide some insight into the problem. I hope you guys can work your magic before we have to release our next major :)

Edit: Oh, for example:
In componentart_webui_client/3_0_1576/A573A488.js change
this.DomElement.style.display='block';
to
this.DomElement.style.display='';
Not Ranked
Posts: 5
ian65000 Posted: Mon Dec 12, 2005 @ 9:51 AM
This is a problem with Componentart rather than Firefox.

The multipage seems to switch pages by flipping the style.display attribute between "block" and "none". Since the actual multipage item that is being switched is a table the display property should be set to "table" rather than "block" (which is used for div, image etc).

Messy workaround:
TabStrip1.ClientSideOnTabSelect = "initFixTables";
Page.RegisterClientScriptBlock("FixTables", "<script type=\"text/javascript\">function initFixTables(){setTimeout(fixTables, 500); return true;} function fixTables(){var colTables = document.getElementsByTagName('TABLE'); for (var i=0;i<colTables.length;i++)if (colTables[i].style.display == 'block') colTables[i].style.display = '';}</script>");


Ian
Top 500 Contributor
Posts: 20
steveq Posted: Thu Mar 9, 2006 @ 5:20 PM
This is something that ComponentArt has control over and should fix. Will the next build contain that fix?

Steve
Not Ranked
Posts: 5
ian65000 Posted: Thu Apr 6, 2006 @ 4:12 AM
From the following changelog about 2006 sp1...
http://www.componentart.com/kb/article.aspx?id=10099

MultiPage
Fix: Visible panes no longer force block display.

I eagerly downloaded the new version but it doesn't seem any different...anyone else noticed a fix in there?
Not Ranked
Posts: 11
gerfboy Posted: Tue Aug 22, 2006 @ 3:32 PM
I'm using ComponentArt version 2006.1.1194.2 and am still seeing the bug in Firefox.

Hope this gets fixed soon.

Thanks for the forum topic, I was going insane before finding this.
Not Ranked
Posts: 11
gerfboy Posted: Wed Oct 25, 2006 @ 3:59 PM
I upgraded to 2006.1.1283.2 and this error is now fixed.

Thanks ComponentArt.
Page 1 of 2 (16 items) 1 2 Next >