PDA

View Full Version : [CLOSED][3.??] HBox doesn't get height of FieldSets right in IE



FunkyBob
13 Jul 2009, 2:21 AM
For some reason in IE the bottom of fieldboxes is lost in the height calculation of HBox when set to align: "stretchmax"

Test case (I made it long enough to scroll on my screen):


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/ext/ext-all-debug.js"></script>
<script type="text/javascript">

var fs1 = {
xtype: "fieldset"
,title: "Short"
,defaults: { xtype: 'textfield' }
,items: [
{ fieldLabel: 'field1' }
,{ fieldLabel: 'field2' }
,{ fieldLabel: 'field3' }
]
};

var fs2 = {
xtype: "fieldset"
,title: "Long"
,defaults: { xtype: 'textfield' }
,items: [
{ fieldLabel: 'field1' }
,{ fieldLabel: 'field2' }
,{ fieldLabel: 'field3' }
,{ fieldLabel: 'field4' }
]
};

var col12 = {
xtype: "container"
,autoEl: "div"
,layout: "hbox"
,layoutConfig: { align: "stretchmax" }
,defaults: { layout: "form" ,flex: 1 }
,items: [ fs1, fs2 ]
};

var col21 = {
xtype: "container"
,autoEl: "div"
,layout: "hbox"
,layoutConfig: { align: "stretchmax" }
,defaults: { layout: "form" ,flex: 1 }
,items: [ fs2, fs1 ]
};

var vp;
Ext.onReady(function () {
vp = new Ext.Viewport({
layout: "fit"
,items: [
{
xtype: "form"
,title: "Test Form"
,autoScroll: true
,items: [
col12
,col21
,fs2
,col12
,fs1
]
}
]
});
});

</script>
</head>
<body>
</body>
</html>

evant
13 Jul 2009, 6:40 AM
We discussed this on IRC, however for completeness:

You haven't provided dimensions for the items you're adding to the form panel, which is why you get differing results. Marking as closed.