Prose Landing Page Width

Community Forums Forums Design Tips and Tricks Prose Landing Page Width

This topic is: not resolved

This topic contains 5 replies, has 2 voices, and was last updated by  wendycholbi 1 year, 6 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #18332

    Si G
    Participant
    Post count: 2

    I’m using the Prose child theme and the landing page template for my site pages.

    I want to reduce the width of the page to 800px.

    I have inserted the following code into the custom code box:

    body {
    background: #f5f5f5;
    margin: 0 auto;
    width: 800px;
    }

    The width of the page is now perfect but the content now sits too far over to the right hand side of the page ie I have a fairly big margin/white space to the left and then a thin margin/white space to the right – I assume that I need to reduce the size of the content box?

    Any help greatly received,

    Si

    #18377

    wendycholbi
    Participant
    Post count: 120

    Yes, you’ll need to reduce the width of the content div (and the sidebar(s) if you are using any).

    Take a look at this thread that includes some code snippets to widen the content area; tweak the numbers to narrow it instead.

    Also, refer to the Genesis Visual Markup Guide to see which boxes you need to narrow (that resource is linked in the thread I mentioned, but it’s so useful I wanted to point it out specifically).

    If you need more help, be sure to post a link to your site so we can take a look at it.


    I love WordPress, Genesis, and the Prose child theme (my complete guide to using Prose is here: SiteSetupKit.com). Say hi on Twitter: @wendycholbi

    #18469

    Si G
    Participant
    Post count: 2

    Hi Wendy,

    Thanks for the help and links.

    I’ve added some code to what I had originally – the code now looks like:

    body {
    background: #f5f5f5;
    margin: 0 auto;
    width: 800px;
    }

    .full-width-content #content {
    width: 700px;
    padding: 0;
    }

    I’m only going to be using the landing page template with this site so I thought that the only ‘content’ element I would need to tweak is the full width content element?

    As you can see from the site the text is still forced over to the right – I’m totally lost when it comes to margins, padding, and float.

    http://www.zippyblogs.com/

    Si

    #18489

    wendycholbi
    Participant
    Post count: 120

    Try adding this to your custom code:

    #inner {
    width: 700px;
    }

    I think that should fix it (by overriding the default width of 900px for that div).


    I love WordPress, Genesis, and the Prose child theme (my complete guide to using Prose is here: SiteSetupKit.com). Say hi on Twitter: @wendycholbi

    #18504

    Si G
    Participant
    Post count: 2

    Wendy – that’s worked!!

    Really appreciate all of your help, many thanks!

    Si

    #18523

    wendycholbi
    Participant
    Post count: 120

    Excellent news, you’re very welcome!


    I love WordPress, Genesis, and the Prose child theme (my complete guide to using Prose is here: SiteSetupKit.com). Say hi on Twitter: @wendycholbi

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.