Bedford: Page-Content area, CSS width control. How do I adjust this?

Bedford Template. Page-Content area, CSS width control. How do I adjust this?

Hi,

You'll want to target the #content section like so:

#content {
 width: 1000px;
}

Custom CSS Help: http://help.squarespace.com/guides/how-should-i-use-custom-css

Hope this helps!

I tried this but the content (in my case a gallery) extended to the right instead of centering itself on the screen. So I ended up with a gallery that ran off the right of the page. Any ideas on how I can center it?

Here's what I have nowwww.alexbroadstock.com/people

Thanks!

Bedford uses max-width to set the width of the content area. To adjust this, override with your own value using this code snippet (added to the CSS Editor):

#page { max-width: 1020px; }

Change '1020px' to your preferred value.

@acbroadstock and @geekgirlweb - rather than the #content element, Bedford actually sets the page max-width on the element just above - #page. See my answer for the correct CSS snippet.

Thank you!!!

So, i'm using pacific which should be similar. I am having trouble achieving the desired result. I only want one page to have an expanded width. that page is home as the first page in my index.

I can increase the width by doing :

#page{ max-width: 100%;}

However, using

#home{max-width:100%;} 

does not work

Should i be using something else in place of #home?

@eanderson

I am having a similar issue with the movie playing on my homepage, where I want the movie to be larger and CENTERED above the content below it. I tried putting in your code suggestion of

page { max-width: 1020px; } but it didn't do anything different. Can you take a look and provide any suggestions to center the video on the page? Thanks so much!

Michael

www.eucalyptusfilms.com/Answered 17 mins ago by mhorwitz 1

Ok just tested and you have to do something else - you page in index has a unique name #something - so to alter only a page with for this video add a video as a regular block and paste this into CSS:

#you-page-title .page-content 

{
max-width: 2000px;
margin: 0 auto;
padding:0px;
}

And done. Example here http://bit.ly/1RLeWgj

Check my answer @mhorwitz - should work perfectly well

Perfect! Been looking for the solution for so long!!! Thanks so much! Works as well for the Hayden template

Perfect! Been looking for the solution for so long!!! Thanks so much! Works as well for the Hayden template

I tried so many variations for width expansion of my Content.Container for this page: http://www.josephghaleb.com/allfilms

I want my thumbnails to span wider, can anyone please help?

thank you!

I tried so many variations for width expansion of my Content.Container for this page: http://www.josephghaleb.com/allfilms

I want my thumbnails to span wider, can anyone please help?

thank you!

This did not work on the page I need it for in my Hayden template. Any tips?

This does not work on my hayden template website. treadawaytraining.com/member-area is the page I am trying to make larger. I've included a picture of what it looks like now. I want that box to span the width of the page.

I am trying to do this for one specific block. How do I make it full size without affecting the rest of the page? please and thank you!

am trying to do this for one specific block. How do I make it full size without affecting the rest of the page? please and thank you!