Datatable width issue in a ScrollPanel

[tosh]

Hi,

I Using PrimeFaces 3.0.M1 with JSF 2.1.1-b04 and am having some styling issues with the datatable. I have put my datatable into a scroll panel as I was having problems with the look of the actual datatable scrolling functionality.

The problem Im now having is that in IE7 the datatable appears to only fill approx 50% of the scroll panel for some reason. It looks ok in firefox 5.0

My datatable is :

Code: Select all

<p:scrollPanel
				styleClass="thinContainer"
				>
		        <p:dataTable 
		        	var="ls" 
		        	value="#{searchBean.loggingsystems}"  
		               selection="#{searchBean.selectedLoggingsystems}" 
		               selectionMode="multiple"
		               id="lstable"
		               styleClass="datatable"
					>
		               <p:column headerText="Logging System" style="width:200px">  
			            <h:outputText value="#{ls.loggingSystemName}" />  
			        </p:column>    
		
		           </p:dataTable>
			</p:scrollPanel>

and the css is :

Code: Select all

.thinContainer{
	width:25%;
	height: 500px;
}
.datatable{
    width:100%;
}

Anyone know how to fix this please?

Thanks

Ps the reason I stopped using the scrollable feature of the datatable is that column headings rendered out of alignment with my actual columns - plus I prefer the look of the scrollbar in the scrollpanel