jebstern

I have a wordpress site that is most likely only used by me.
If you have a business site or otherwise a site with many visitors, then this fix may not be so clever, since I havent tested it that much.
But it is working nicely for me atleast; both on a desktop computer and Galaxy S3 phone(I dont see any changes in the responsive layout).

So the changes i made:

themes/sparkling/header.php

Changed “container” to “container-fluid”:
Line 87:
From: <div class=”container main-content-area”>
To : <div class=”container-fluid main-content-area”>

Changed “col-md-8” to “col-md-10” so that the main content is wider
Line 89:
From: <div id=”content” class=”main-content-inner col-sm-12 col-md-8 <?php echo of_get_option( ‘site_layout’ ); ?>”>
To : <div id=”content” class=”main-content-inner col-sm-12 col-md-10 <?php echo of_get_option( ‘site_layout’ ); ?>”>

themes/sparkling/sidebar.php

Changed “col-md-4” to “col-md-2” so that the sidebar is narrower
Line 9:
From: <div id=”secondary” class=”widget-area col-sm-12 col-md-4″ role=”complementary”>
To : <div id=”secondary” class=”widget-area col-sm-12 col-md-2″ role=”complementary”>

You can ofcourse tune more of the other elements, but this was a fast and easy solution.

You can read more about Bootstrap grid system here:
http://getbootstrap.com/css/#grid