apostrophe theme – how to expand center content width

  • dmoss5211 · Member ·

    I would appreciate any CSS help I can get expanding the center content width. I’m using the apostrophe theme.

    Thanks!

    The blog I need help with is: (visible only to logged in users)

  • thesacredpath · Member ·

    Hi, see if this is what you are wanting. The current max width on the overall #page div is 1140px. Go to Appearance > Customize > CSS, delete all the informational text in that window, and paste in the following custom CSS and adjust the 1140px value. 

    #page {
    max-width: 1140px;
}
  • dmoss5211 · Member ·

    No, that didn’t work :(

    I put that in and everything stayed the same. Perhaps i’m not doing something correctly? In the CSS window it says, “The default content width for the Apostrophe theme is 723px.” You suggested that the px go to 1140, is that outside of the parameters for the theme?

    I changed your code from 1140 to 723 and everything stayed the same. The only difference I see is if I reduce the px number then everything scrunches together. I’m not willing to believe just yet that I can only make the center content width smaller when I have 3 inch wide margins on both sides of my content. I just want to make it fit the entire screen and have more real estate to work with.

    Perhaps using CSS to decrease the margins? Is that possible to do? I asked the support chat line and they said it could possibly be done with extensive CSS, but they stopped there and didn’t provide anymore help except directing me here to these forums.

    I’m not CSS savvy at all but would graciously accept any help I can get. I would however like a straight answer though. Either it can be done or can’t.

    If it can then I would like to know how. Thanks.

  • thesacredpath · Member ·

    Hi, first off, you need to remove this from your custom CSS since it has no CSS selector, and without a CSS selector, anything placed after it is ignored. 

    {
	max-width: 100%;
	margin-right: 2px;
}

    Secondly, the 1140px value is what the width is now. You need to adjust that number to whatever value you want.

    As an example, the following would increase the maximum width of your site from 1140px to 1540px, an increase of 400px. You would then put 1540px into the Media Width field. 

    #page {
  max-width: 1540px;
}
  • dmoss5211 · Member ·

    You are the man! Now it works most excellently :)

    gleefully happy

  • thesacredpath · Member ·

    Hooray and glad you are gleefully happy. That makes me happy. :)

  • The topic ‘apostrophe theme – how to expand center content width’ is closed to new replies.