[rgamlam]

Hi, I was hoping someone might be able to help me reduce the sidebar width using CSS? Is there an easy way to do this? I like having the sidebar but it is so large compared to my text.

[Sakin]

@rgamlam: Can you send me your site URL and the width that you want. Then I will check in Custom CSS to edit that for you.

[rgamlam]

Hi Sakin, thanks so much! My site is http://www.adventuresaroundasia.com
I’d like the make the right sidebar slightly smaller, maybe 1cm-1.5cm. As you can see, it takes up about 1/3 of the writing space and it looks somewhat awkward when the ads and widgets finish. I’d like to make it about 1/4 of the overall space rather than 1/3. Thanks so much for your help!

[Sakin]

@rgamlam: You can add the following css in “Appearance => Theme Options => Custom CSS” box.

@media screen and (min-width: 961px) {	
	#primary {
		width: 530px;		
		width: 53rem;
	}		
	#secondary {
		width: 300px;
		width: 30rem;
	}		
}
@media screen and (min-width: 1025px) {
	#primary {
		width: 590px;		
		width: 59rem;
	}		
	#secondary {
		width: 300px;
		width: 30rem;
	}		
}
@media screen and (min-width: 1153px) {
	#primary {
		width: 670px;		
		width: 67rem;
	}		
	#secondary {
		width: 310px;
		width: 31rem;
	}	
}
@media screen and (min-width: 1281px) {
	#primary {
		width: 750px;
		width: 75rem;
	}
	#secondary {
		width: 320px;
		width: 32rem;
	}	
}
@media screen and (min-width: 1345px) {
	#primary {
		width: 770px;
		width: 77rem;
	}
	#secondary {
		width: 360px;
		width: 36rem;	
	}
}

[rgamlam]

Thank you so much! It looks so much better now!!

I commented about a different issue on another forum that you also may be able to help me with. The text in my posts automatically adds hyphens rather than just moving the word down to the next line. Is there any way to fix this? It’s pretty distracting but especially bad for titles.

Here’s an example of a title with a hyphen, and you can see that it does it throughout the post as well. http://www.adventuresaroundasia.com/2014/02/24/this-is-home-a-photo-essay-of-my-ningbo-experience/

Again, thank you so much for helping change the sidebar width! It looks awesome.

[Sakin]

@rgamlam: Try adding in the following css in “Appearance => Theme Options => Custom CSS” box.

.site-content article {
  -webkit-hyphens: manual;
  -moz-hyphens: manual;
  hyphens: manual;
}

[rgamlam]

It worked! Thank you so much 🙂

[Author]

Posts