Page 1 of 1

Size in <p:column

Posted: 16 Nov 2015, 22:50
by vished
Dears,

For a column for Desktop devices I need only width: 45px. In more detail this ist the column for a small button.
But for Mobile Devices I need the complete width.
How can I do this?

Code: Select all

<p:column style="width: 45px;">
								<h:link outcome="/portal/deviceGlobalEdit">
									<p:button icon="fa fa-laptop"
										title="Detail" />
									<f:param name="id" value="#{device.id}" />
								</h:link>
							</p:column>
Can anybody help me, please.

Re: Size in <p:column

Posted: 17 Nov 2015, 10:06
by mert.sincan
I think you can use @media queries for this issue.
Our media queries;

Code: Select all

/* Large desktop */
@media (min-width: 961px){
	
}
 
@media (min-width: 961px) and (max-width:1200px){
	
} 
 
/* Portrait tablet to landscape and desktop */
@media (min-width: 640px) and (max-width: 960px){

}

/* Landscape phone to portrait tablet */
@media (min-width:480px) and (max-width: 640px) {	

}
 
 
/* Portrait phones and down */
@media (min-width:320px) and (max-width: 480px) {
	
}
Exp;

Code: Select all

@media (min-width: 961px){
    .test {
        width:45px;
    }
}

//XHTML
<p:column styleClass="test" ..>