Find :
div#content #padder – increase margin-right to 300px
#sidebar change width to 300px and margin-left to -301px
However it looks as though you are using the default theme and changes like this should be made to a child theme in as much as you create a new theme directory and set up a new stylesheet that calls the default.css and other files but allows you to add override styles into this new styles.css.
Edit/ just noticed that your are actively editing / changing your theme layout so my earlier advice may or may not hold good
Hi @hnla and thanks for your reply.
I followed the instructions you gave, but must have done something wrong as the column width didn’t change, but all the widgets it was previously displaying vanished. I had to reinstall BuddyPress from scratch to recover it. Any guesses as to where I went wrong?
PS. I’m not very savvy when it comes to CSS.
If you are making changes to styling you do NOT have to reinstall BP from scratch, it’s simply not necessary.
You should be making changes to a child theme; are you using a child theme? If not follow these instructions here:
https://codex.buddypress.org/how-to-guides/building-a-buddypress-child-theme/
If you are making the changes I described earlier then you enter them in the newly created stylesheet file and they act as an override to the default styles that are pulled in to this stylesheet file.
If you follow this procedure you change nothing about the default styling that can’t be reversed by either simply deleting your new ruleset styles from the child stylesheet file or wrapping them in comments to kill them:
/* #content {these styles cease to be read} */
Give things another go but this time if it doesn’t work don’t reverse things leave it up live if you can and I’ll look and see where you have gone wrong.
Hmm… think I may be editing the wrong file or something?
I’ve done as you said and created a child theme (which is still activated). I’ve created a new copy of default.css and edited the settings as instructed above, but still no change?
That doesn’t sound correct, if you follow the instructions given on the child theme codex page then you will have a stylesheet that references the original default.css you do not want to create a duplicate of it, you make your changes in the new child theme stylesheet, that’s the one that calls default.css with a line that should look like this:
@import url( ../../plugins/buddypress/bp-themes/bp-default/_inc/css/default.css );
BTW there was a typo which wouldn’t have helped matters in my original post where I described an ‘ID’ it should have been a ‘class’; my bad!
Should read:
div#content .padder {margin-right:300px;}
As I understood the linked post, you create a new theme folder, create style.css (which links to the default theme) and then any changes you wish to make, are made within the new folder by copying the default files and altering them?
Try this which should work:
/*
Theme Name: TSS
Theme URI: http://www.thescratchingshed.com/themes/tss/
Description: TSS custom
Version: 1.0
Author: TSS
Author URI: http://www.thescratchingshed.com/
Template: bp-default
Tags: buddypress, two-column, blue, white
*/
/* Inherit the default theme styles */
@import url( ../../plugins/buddypress/bp-themes/bp-default/_inc/css/default.css );
/* Inherit the default theme adminbar styles */
@import url( ../../plugins/buddypress/bp-themes/bp-default/_inc/css/adminbar.css );
/* Begin custom styles
*/
/* change primary sidebar width to 300px */
div#content .padder {margin-right:300px;}
div#sidebar {width:300px;margin-left:-301px;}
Ahh right, I see. I’ve totally misread what it said in the help file.
Thanks for your infinite patience!
are made within the new folder by copying the default files and altering them?
Yes and no. You can approach things in a few ways – first, and as I’ve seen that you have done, is to inherit the original files then you could add further styles after the @import statements as I’ve shown one post above.
you can copy ALL _inc/css/*.css files to your theme and edit them directly then your @import path would be simply (_inc/css/default.css)
This does mean that if the BP default theme is updated and changes made to the themes CSS your theme will not get them.
Lastly use nufink and do it all oneself 
big job, long time!
That’s better one thing though: At the moment copying and pasting from this site doesn’t work as characters are being converted, where I set out a series of em dashes it translated those to hyphens I think or vis versa manually edit the comment I made and replace that long line with your own dashes or remove altogether.
Last few things just to stop the main links from wrapping and bunching up.
Add these lines:
#header h1 {bottom:30px;}
ul#nav {max-width:80%;}
Although to be honest width is probably better as IE6 doesn’t understand min-* property
Everything was fine on my end, but I’ve made the changes you mentioned. Everything working OK now?
If you narrow your browser you will see the issue, links set out this way only work in fixed width layouts or at least where the min overall layout width is greater than the links, At min layout width and max width as set the links haven’t enough room, start adding plugins that add links to the main set and the problem gets worse, this adjustment allows a bit of room to breath.
OK, I’m really new to this.
When I change the headder info on style.css does it overwrite style.css or create a new theme called Buddy Dusk?
