Problem #

The Brochure theme has a maximum width set to 760px. Even if you change it to full screen in the backend it still will not go wider then 760px.

While the Brochure is designed to be like this, in some situations people have found it interesting to reuse it for cases where a full screen width is preferable. The next section describes how to achieve this modifying the CSS of the theme.

Solution #

Liferay 4.2 #

To get around this problem and make it full screen the div that sets the width can be renamed, therefore when the HTML page try's to call the div it cant be found so the width will go to the full browser width - 100%.

go to: /themes/brochure/templates and open css.jsp

find:

 layout-outer-side-decoration

rename to:

 layout-outer-side-decoration_1

Save the file. Now force refresh your browser and the theme will go full screen.

This is really a bit of a 'hack' ideally the value of 760px should be found and changed to a 100%, however I've not be able to find this value.

New Solution #

go to: /themes/brochure/templates and open init.jsp

comment the line: themeDisplay.setResolution(760);

Liferay 4.3 #

/html/themes/brochure/css/custom.css (Line 7): Replace

 #wrapper {
 	width: 825px;
 }

with

 #wrapper {
 /*	width: 825px;*/
 	width: 100%;
 }

Note: The theme's blue bar whose picture is found at /html/themes/brochure/images/navigation/bg.png doesn't seem to scale, so that might have to be changed too to to get a nice full width theme. If you customized it, we would appreciate if you post a reference and guide here.