is it possible to make page wider

  • Unknown's avatar
    benagen · Member ·

    Please take a look at my site
    http://www.appledoesnotfall.com

    pages are too narrow. A pretty big white spaces are left on a both sides. Is it possible to make them wider?
    Thank you so much

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

  • Unknown's avatar
    jeremeylduvall · Member ·

    HI!

    Can you give this a try?

    .site-content .entry-header, .site-content .entry-content, .site-content .entry-summary, .site-content .entry-meta, .page-content {
	max-width: 900px;
}

    Just insert that under Appearance -> Customize -> CSS. It should widen the content to 900px. I checked the appearance of the site on mobile devices (tablets and phones). It seemed to work alright, but please let me know if you find otherwise!

    Also, just a note, we have a whole forum devoted to CSS customizations here:

    https://en.forums.wordpress.com/forum/css-customization

    It can be helpful for CSS-specific questions or if you want to increase your own knowledge!

  • Unknown's avatar
    benagen · Member ·

    Thanks,yes it does work!
    in the same issue:
    1. is it possible to get rid of whole wide empty green space on the right hand site?
    2. Is it possible to make multiline title?
    So many thanks for your help…

  • staff-happychia · Staff ·

    1. 

    .site, .site-header {
max-width: 100%;
}

    You will have to increase the width of the header image to remove the whitespace that appears after applying this style.

    2.
    I don’t think we can make the title multiline. So I suggest you reduce the font size to 100% in your following current style.

    .site-title a {
font-size: 150%;
}

    But I may be wrong.

  • Unknown's avatar
    jeremeylduvall · Member ·

    I would agree with staff-happychia regarding #2. Reducing the font size would be a better option all around than breaking the site title onto two lines. You could use something like this:

    h1.site-title a {
	max-width: 500px;
	white-space: normal;
}

    That would break the title onto two lines, but in my opinion, it doesn’t look the best on mobile devices.

  • staff-happychia · Staff ·

    I didn’t know about white-space property. Thank you jeremeylduvall. :-)

  • Unknown's avatar
    jeremeylduvall · Member ·

    To be fair, I didn’t either until I fidgeted around with the dev tools. I’m definitely saving that for use later on! :)

  • The topic ‘is it possible to make page wider’ is closed to new replies.