The following tutorial covers changing of Brio Plone Theme portlet columns width on a Plone 3 website. Instruction for Plone 4 website - see in Column Width Customization in Plone 4 tutorial.
Content area on a site where Brio Plone Skin installed is subdivided into two columns: column one is usual portlet column, column two - is a content area and, besides, second second-column portlets are placed at the bottom of this content area by 3 portlets in a row.
Column width can be changed: we define first column width, and the second column width is generated on the basis of the width of the first column.
1. How to change column width via Zope Management Interface
Go to ZMI interface and select portal_skins -> qBrio.
This folder has base_properties document
that contains information about Plone's color, logo and border defaults. Now column one width is 200px. In case you want to change this number press Customize button.
In the opened window change columnOneWidth value from 200px to your new column width. Do not delete px. If you change columnOneWidth value you should change columnOneWidthInteger value as well, but no px here. The numbers in these two lines should coincide so that skin view is not broken. Let's put, for example, columnOneWidth value = 340px, than columnOneWidthInteger value = 340.
Save changes. Now return to Plone Interface and you'll see your changes applied: column one width widened, with navigation items lines and search box widened as well.
2. How to change column width via File System
There is a base_properties document in qBrio folder:
Open it and you will see the list of main skin properties: Plone's color, logo ans border defaults:
Now column one width is 200px. In case you want to change it - change columnOneWidth value from 200px to your new column width. Do not delete px. If you change columnOneWidth value you should change columnOneWidthInteger value as well, but no px here. The numbers in these two lines should coincide so that skin view is not broken.
Let's put, for example, columnOneWidth value = 300px, than columnOneWidthInteger value = 300.
Save changes. Now restart server so that changes are applied. When you get back to Plone interface you will see your changes applied: column one width widened, with navigation items lines and search box widened as well.