How do I set the forum width

In SMF 2.0 it is possible to change the forum width setting by going to Administration Center > Configuration > Current theme. The value can be set as a percentage or in pixels. Note that you can the forum width for themes other than the current one by clicking on the theme name. If you need help with modifying the forum width for specific themes, please ask in the Graphics and Templates or Theme Site Themes boards.

Start by looking at Themes/default/style.css:

/* The main body of the entire forum. */
body
{
	background-color: #E5E5E8;
	margin: 0px;
	padding: 12px 30px 4px 30px;
}

The SMF Default (Core) theme is set to fill your browser window with no margins. It does, however, have 30px of left and right padding (the style declaration order being top, right, bottom, left).

While things are not quite so obvious in the Babylon and Classic YaBB SE themes, the changes necessary to reset the width are no more complicated. (Some scattered margin/padding settings in these themes have been ignored here for simplicity, but you can normally increase your percentage or pixel width slightly to compensate for these.)

Two important considerations are the following:

• Whether you want to set a new percentage width to expand and contract with the browser window.
• Whether you want to set a new fixed width regardless of the available browser window.

Some Notes about the Solutions

• Your forum is centered by default and will remain centered if you follow the instructions.
• The 70% width and 15% left and right margins are just examples and you should substitute your own figures.
• The 700px fixed width is just an example and you should substitute your own figure.
• The 'style.css' and 'index.template.php' solutions are alternatives and should not both be applied at the same time.
• The -350px left margin is just an example, but must always be less than 50% of the fixed width to keep your forum centered.

style.css solutions for Core theme

To set your percentage width for the Core theme, search Themes/default/style.css for the code quoted above, reduce the 30px left and right padding to zero, and specify your own percentage left and right margins (note the shorthand style declaration order of top/bottom right/left):

/* The main body of the entire forum. */
body
{
	background-color: #E5E5E8;
	margin: 0 15%;
	padding: 12px 0 4px 0;
}

To set your fixed width for the Core theme, add your width to the same style rule, set the left and right margins to auto, and remove the left and right padding as above:

/* The main body of the entire forum. */
body
{
	background-color: #E5E5E8;
	margin: 0 auto;
	padding: 12px 0 4px 0;
	width: 700px;	
}

style.css solutions for Babylon theme

To set your percentage width for the Babylon theme, find a similar passage in Themes/babylon/style.css, and specify your own percentage left and right margins as above:

/* The main body of the entire forum. */
body
{
	background-color: white;
	margin: 0 15%;
	padding: 0;
}<nowiki>
}}

To set your fixed width for the Babylon theme, find a similar passage in Themes/babylon/style.css, add your width to the same style rule, and set the left and right margins to auto as above:
{{code|1=<nowiki>/* The main body of the entire forum. */
body
{
	background-color: white;
	margin: 0 auto;
	padding: 0;
	width: 700px;
}

style.css solutions for Classic theme

To set your percentage width for the Classic YaBB SE theme, find this passage in Themes/classic/style.css:

/* By default (td, body..) use Verdana in black. */
body, td, th
{
	color: #000000;
	font-size: small;
	font-family: verdana, sans-serif;
}

Add the following code before or after it (do not worry, it does not conflict with it):

/* The main body of the entire forum. */
body
{
	margin: 0 15%;
	padding: 0;
}

To set your fixed width for the Classic YaBB SE theme, find the same chunk of code, and add the following code before or after it (again, do not worry about conflicts):

/* The main body of the entire forum. */
body
{
	margin: 0 auto;
	padding: 0;
	width: 700px;	
}

index.template.php solutions for any theme

To set your percentage width for any of the three packaged themes, add this code straight after the <body> tag in the relevant index.template.php:

<div style="text-align: center;"><div style="width: 70%; margin: auto; text-align: left;">

Also, add the following code just before the </body> tag:

(The outer container div is used to 'fool' the browser into centering the inner one while retaining the standard left text alignment.)