page wider

[evelina van ‘t Hoog]

Hi Bill,

I am using yout Bottega theme at the moment which I love!

I was wondering if it is possible to make the body + sidebar a bit wider with some custom css. I have tried it, but my screen turned black (oops).

As you can see I want to use the theme as an event calendar, but it is a bit squeezed at the moment. 😉 http://costahappenings.com/east-of-malaga/

So I need the whole content body (where the events are) including the sidebar space a bit wider. Of course the header and footer has to adapt as well.

Thank you!

Evelien

[Bill Robbins]

Hello Evelien,

I’m glad you’re enjoying our Bottega theme 🙂

Here’s one way you could make that page have a larger content area and sidebar:

1. Go to your theme options page and choose the Advanced tab.
2. Scroll down to the Custom CSS box and add this:

   
   @media only screen and (min-width: 1200px) {
   
   	.page-id-24 #wrap {
   		width: 1140px;
   	}
   	
   	.page-id-24 #sidebar {
   		width: 300px;
   	}
   	
   	.page-id-24 #content {
   		width: 730px;
   	}
   	
   
   }
   

3. Update your settings.

Let me know if you have any questions.

Thanks,
Bill

[Bill Robbins]

You could make all the pages except for the home page larger like that. Instead of the snippet above, use this:

@media only screen and (min-width: 1200px) {

	#wrap {
		width: 1140px;
	}
	
	#sidebar {
		width: 300px;
	}
	
	#content {
		width: 730px;
	}
	
	.home #wrap {
		width: 960px;
	}
	
}

See if that doesn’t do the trick for you. Let me know if you have any trouble at all.

Bill

[Author]

Posts