BuddyPress.org

Hello,

I have been struggling to widen the sidebar width for the Buddypress Default theme on my website, http://www.DonorChildren.com.

I found some workarounds but none that didn’t create other issues. I installed the My Custom CSS plugin and wrote this in the tool:

div#content_width .padder {
margin-right: 411px;
}
div#sidebar {
margin-left: -412px;
width: 410px;
}

That works but then the mobile version of my site is all jacked up and the content is squished to the left of the screen. The tablet mostly works but there is still some overlapping with the ads.

I tried installing the WP Mobile Detect plugin and adding some wording to the CSS plugin modification:

[notphone]div#content_width .padder {
margin-right: 411px;
}
div#sidebar {
margin-left: -412px;
width: 410px;
}[/notphone]

This was supposed to make the CSS changes ONLY for the desktop and tablet. It works in a sense that the mobile device now views my site correctly but the desktop and tablet has overlapping between the sidebar and content. It seems no matter what I do I am unable to modify the widths of the content and sidebar without losing functionality elsewhere. This seems like such a simple task but I am not a skilled developer so could use some direction.

Any help out there?

Running 2.0.1 Buddypress and 3.9.1 WordPress.

Thanks