Control the maximum page display size (for desktop view).

• 

  mikeyjr1 · Member · Mar 24, 2015 at 3:18 pm

  • Copy link
  • Add topic to favorites

  How do I control the maximum page display size (for desktop view) ?

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

• 

  jeremeylduvall · Member · Mar 24, 2015 at 6:37 pm

  • Copy link

  Hi!

  I’m not quite sure what you mean by “maximum page display size.” Are you referring to the maximum page width when viewed on larger screens?

• 

  mikeyjr1 · Member · Mar 24, 2015 at 6:44 pm

  • Copy link

  Hi

  Yes…I’d like to format the page in a way that I can control the maximum page dimensions e.g. height x width so that it will not look so big on a large screen while at the same look good on an average size monitor screen.

  Thanks!

• 

  jeremeylduvall · Member · Mar 24, 2015 at 10:27 pm

  • Copy link

  Hi!

  I can definitely help you to control the width of the content on various screen sizes. However, I’m a bit confused by this part:

  it will not look so big on a large screen while at the same look good on an average size monitor screen.

  Just so we’re on the same page, you’re looking to decrease the width of the content? We should be able to use some CSS under Appearance -> Customize -> CSS like this:

  body.no-sidebars #container {
  	max-width: 500px;
  }

  You can adjust that max-width value to hit a certain width. However, once I know specifically what you’re looking to do, I’ll likely be able to provide a more targeted CSS code!

• 

  mikeyjr1 · Member · Mar 25, 2015 at 12:02 am

  • Copy link

  Hi

  Previously, I probably provided you with too much information. Sorry…

  I would like to adjust the width and the height of the content.

  Thanks!

• 

  jeremeylduvall · Member · Mar 25, 2015 at 2:55 pm

  • Copy link

  Hi,

  I understand that we’re trying to adjust the height and the width. However, in order to provide the CSS necessary, I need to know exactly what you’re looking to accomplish. For example, this CSS code should decrease the overall width of the content:

  body.no-sidebars #container {
  	max-width: 500px;
  }

  It’s a bit crude though so I’d like to help you refine it, but I need your help for that.

  First, do you want the content width to shrink or expand?

  Second, can you elaborate on what you want to change about the height?

  Perhaps if you could point me to an example site that resembles the look you’re going for, I’ll be able to help more!

• 

  mikeyjr1 · Member · Mar 27, 2015 at 11:18 pm

  • Copy link

  Hi…I created a pdf (refer to post entitled WP Support) that shows how I would like to have my post pages (and all other pages) appear on a desk top.

  The dotting line that’s shown on the attachment represents the edge of a monitors screen.

  I’d like to maintain the look shown in the attachment by having it automatically resize to accommodate any size desk top monitor.

  Thanks!

• 

  jeremeylduvall · Member · Mar 27, 2015 at 11:27 pm

  • Copy link

  Hi!

  Thanks – I think I get a sense of what you’re trying to do. You would like the page to have less padding/margin here:

  http://d.pr/i/150Re

  Can you try adding the following CSS code and let me know if that brings us closer or farther away from what you’re looking for?

  body.no-sidebars #container, .full-width #container, .attachment #container {
    max-width: 1200px;
  }