I was playing with the theme and some responsive elements within them and came across what seems to be a bug/misbehavior.
Essentially I have two Container50's at the top then a Container75 below them. When I set the select p:selectOneRadio layout propoerty to responsive, both the Container75 and Container25 at the bottom is pulled into the Container50 on the right. When I set it back to grid it works as expected.
Anyone have any ideas?
I have my xhtml page as follows:
Code: Select all
<div class="Container50 Responsive">
...
</div>
<div class="Container50 Responsive">
<div class="ContainerIndent">
<div class="Container30" >
...
</div>
<div class="Container70 Responsive">
<div class="ContainerIndent">
<p:tabView id="...">
<p:tab title="...">
...
<p:scrollPanel style="display: inline-block; width: 93%; max-height: 110px; min-height: 110px;">
<p:message for="..." id="..." />
<p:selectOneRadio id="a" value="..."
layout="grid" columns="2" >
<f:selectItems value="..." var="offense" itemLabel="..." itemValue="..."/>
</p:selectOneRadio>
</p:scrollPanel>
...
</p:tab>
<p:tab id="meritTab" title="...">
...
</p:tab>
</p:tabView>
</div>
</div>
</div>
</div>
<div class="Container75 Responsive">
...
</div>
<div class="Container25 Responsive100">
...
</div>
