pe:layout: Align tabs to right

Question

In the showcase example for http://fractalsoft.net/primeext-showcase-mojarra/sections/layout/tabbedLayout.jsf

tabs are centered right, I can't figure out how to do it.

I've tried searching and applying ui-tabs styling and I can change size easily but not the tab alignment.

For example this did not work: jQuery UI tabs aligned and sharing bar with a title

This seems to be the relevant css http://code.google.com/p/primefaces-extensions/source/browse/primefaces-extensions/trunk/src/main/resources/META-INF/resources/primefaces-extensions/layout/layout.css?r=1201

and pe-layout-tabbuttons is indeed present when I firebug the code but I can't figure out what to change.

I basically want this:

_________________|tab1|tab2|tab3|

instead of: |tab1|tab2|tab3|_________________

cheers

Answer 1

It seems that this CSS does the magic:

.pe-layout-tabbuttons {
    left: auto !important;
}

To see how to use CSS in JSF see here.