Minimizing the side bar

Sparkling
1

Hi,

I wanted to ask how i can increase the main part of the page and slightly minimize the side bar.

Thank you,
Mark

2

Hi Mark,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS


@media (min-width: 992px){
.main-content-inner.col-sm-12 {
    width: 70%;
}
#secondary{
      width: 30%;
}
}

Best Regards,
Movin

3

Hi

Kind of comeback question: it worked well, recently i did template update (and reversed it) and since then the sidebar went to original and the % i set have no effect.

Any idea why?

Thank you

4

Could you please share me your site URL where it’s happening so that i can troubleshoot it?

5

Sure. here is is: http://instantwithdrawals.org/

6

It is not working on your site because the custom CSS code that you are using on your site contains some error as shown in the attached screenshot that you should fix.

7

Sorry, complete newbie to coding. So to delete # and then to increase main column just to change % from 72/28 to 75/25?
That’s it?
Thank you

8

Yes you are right.

9

Strange. I fixed but no matter what i do - it remains the same.

10

Try adding it in the top of your custom CSS code.

11

You mean like this - if yes then no change. (thank you for all your help btw) :slight_smile:

⁠⁠⁠⁠@media (min-width: 992px){ .main-content-inner.col-sm-12 { width: 75%; } #secondary{ width: 25%; } }

#secondary .widget,
#secondary .widget a {
color: #09c1eb;
font-weight: bold;
text-decoration: underline;
}
.pace,
.pace-overlay{
display: none ! important;
}

12

It seems there is an issue you are copying the code so please try copying following code exactly and use it in your custom CSS code. Also please remove your existing added code.

@media (min-width: 992px) {

	.main-content-inner.col-sm-12 { 
		width: 75%;
	} 
	
	#secondary{ 
		width: 25%; 
	}
}
13

Thank you so much!
Fixed

14

You are most welcome here :slight_smile: