That's why I told you before if you want to change all the width of the forum or only the main content, because you need to adjust a few classes to achieve the same width for all the style.
Now you need to go to ACP > Templates & Styles > Templates > Square templates > Index templates and open index template
Inside index template you need to find this:
<div class="sidebar" style="float: right; width: 250px;">
And this:
<div class="forums" style="float: left; width: 724px;">
Now you need to calculate, this is the simple math I do with the original style:
Base resolution: 1024px /984px of width and 20px of padding each side)
Then with that, 984 - 250px of the sidebar = 734px free.
Now 734px free - 10px of space between the forum and the sidebar = 724px for the forums.
Then I put 250px in the first code, and 724px in the second code.
Now you need to go to ACP > Templates & Styles > Templates > Square templates > Ungrouped templates and open headerinclude
Inside headerinclude search this:
<script type="text/javascript">
jQuery(function($) {
$(".clickedbuttons").hide();
$(".buttons").click(function() {
$(".sidebar").animate({height: "hide", opacity: 0}, 500,
function() {
$(".forums").animate({width: "984px"}, 500);
});
$(this).hide();
$(".clickedbuttons").show();
$.cookie("sidebar","collapsed", {expires: 365});
return false;
});
$(".clickedbuttons").click(function() {
$(".forums").animate({width: "724px"}, 500,
function() {
$(".sidebar").animate({height: "show", opacity: 1}, 500);
});
$(this).hide();
$(".buttons").show();
$.cookie("sidebar","expanded", {expires: 365});
return false;
});
if($.cookie("sidebar") == "collapsed") {
$(".buttons").hide();
$(".clickedbuttons").show();
$(".forums").css("width","984px");
$(".sidebar").hide();
};
});
</script>
Here you will put the total amount (Within the padding) of the container or in this case, the wrapper, replacing the 984px in all the code.
And finally, you need to replace the 724px of the forum width, with your new amount of px.