Safari hang on display:table-cell
document.getElementById('cssform1').style.display='table-cell'; (danger!)
document.getElementById('cssform1').style.display='table';
document.getElementById('cssform1').style.display='block';
What we know:
* Safari 2.0.4 (419.3) hangs up on
<form style="display:table-cell;"> ... any content here ... </form>
(CSS2.1 17.2.1 point 1 suggests this should render fine.)
* Using CSS rather than inline styles doesn't help.
* Applying the style statically doesn't help. The reason we are using JS
here is to avoid killing your browser on page load.
* Wrapping a display:block element (eg. a div) around the form doesn't help.
* Wrapping <div style="display:table"> around the form doesn't help.
* Wrapping <div style="display:table"><div style="display:table-row">
around the form prevents the hang, but also doesn't show the form at
all. This is regardless of the value of the display property on the
form itself.
That is:
<div style="display:table">
div1
<div style="display:table-row">
div2
<form action="action" style="display:table-cell">
form starts here
<b>bold</b>
<input type="text" name="y" value="1" />
<input type="hidden" name="x" value="1" />
</form>
form has ended
</div>
</div>
Displays the string "div2form has ended" (ie. the form is not rendered).
* However:
<div style="display:table-cell">
div1
<form action="action">
form starts here
<b>bold</b>
<input type="text" name="y" value="1" />
<input type="hidden" name="x" value="1" />
</form>
form has ended
</div>
Displays as expected.
* The following seems to work and may count as a workaround in some circumstances:
<form style="display:table" action="action"> </form>