Widen text margins and grid layout

  • Unknown's avatar
    designology15 · Member ·

    I want to widen the margins on my pages, can anyone send me the code for that?

    Thanks,

    Moya

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

  • staff-totoro · Staff ·

    Hi there,

    When you say you want to widen the margins, do you mean you want to increase the width of your site overall?

    Or do you mean that there are specific margins in the content that you want to adjust, like the width of the text column in blog posts, for example?

    Thanks for the additional info!

  • Unknown's avatar
    designology15 · Member ·

    Hi Jerry,

    Thanks for your reply.

    Yes I want to increase the width overall, sorry I wasn’t clearer.

    Do you know how I can do this?

    Thanks, Moya

  • staff-totoro · Staff ·

    Thanks for explaining. So this will be a bit tricky to accomplish, due to the fact that your theme adapts it’s width to fit on small screens (tablets and phones) so let’s start here:

    #page {
  max-width: 1400px;
}

@media screen and (min-width: 1180px) {
	.content-area {
	  width: 900px;
	margin-left: 10px;
	}
}

    The #page rule is what forces the entire page to be wider, but along with that a second style rule is needed for the .content-area to help “fill” the extra whitespace between the content and the sidebar.

    You can modify the sizes to find what works for you, but be aware that you may need to experiment a bit. Once you find a #page width you like, you may need to play around a bit with the correct .content-area to fill the gap between the that column and the sidebar.

    Hope that helps!

  • Unknown's avatar
    designology15 · Member ·

    That definitely helps! Thanks so much for your help!

    Moya

  • staff-totoro · Staff ·

    Great, glad I could help!

  • The topic ‘Widen text margins and grid layout’ is closed to new replies.