Banner & Forum Width Difference

[Former Member]

I don't know exactly how to do this: I'd like to change my forum's width to be smaller, but keep the banner at 100%. Is this possible?

[Former Member]

bumpy ~

[Former Member]

Is the forum in your signature the one you're asking for help for?

[Former Member]

Yep!

[Former Member]

Actually, this one too:

gray-and-gherkin.proboards.com

[Bob]

Apr 23, 2019 4:08:55 GMT -8 @majority said:

I don't know exactly how to do this: I'd like to change my forum's width to be smaller, but keep the banner at 100%. Is this possible?

You're going to need to kick the forum's base width up to 100%.  You've done that on the forum in your sig, but the forum you linked to is set to 80%.  Go to Admin > Themes > Advanced Styles & CSS > Forum - Width and change the value of that field to 100%.  From there, we'll use a little bit of CSS to take this home.  Switch over to the Style Sheet tab in that section, and drop this in:

#content {
 margin: 0 auto;

 width: 80%;
 max-width: 1100px;
}

You'll want to change the 80% for whatever you want the width to be.

You can remove the max-width rule if you'd like.  But it can be useful if you want to set a maximum.  For example, someone with a standard 1080p monitor (1920w x 1080h) will see your forum around 1520px wide (accounting for scrollbar reducing the width of the viewport), at 80%.  Someone on a monitor using 1440x900 will see your forum around 1145px wide, as that's roughly 80%.  Using max-width, you can set an upper bounds.  In this case, the content of the forum will be 80% of the user's viewport, up until that value exceeds 1100px, in which case it will stay at that width.  Change it up as you see fit, or remove it!

[Former Member]

Apr 25, 2019 16:25:13 GMT -8 Bob said:

Apr 23, 2019 4:08:55 GMT -8 @majority said:

I don't know exactly how to do this: I'd like to change my forum's width to be smaller, but keep the banner at 100%. Is this possible?

You're going to need to kick the forum's base width up to 100%.  You've done that on the forum in your sig, but the forum you linked to is set to 80%.  Go to Admin > Themes > Advanced Styles & CSS > Forum - Width and change the value of that field to 100%.  From there, we'll use a little bit of CSS to take this home.  Switch over to the Style Sheet tab in that section, and drop this in:

#content {
 margin: 0 auto;

 width: 80%;
 max-width: 1100px;
}

You'll want to change the 80% for whatever you want the width to be.

You can remove the max-width rule if you'd like.  But it can be useful if you want to set a maximum.  For example, someone with a standard 1080p monitor (1920w x 1080h) will see your forum around 1520px wide (accounting for scrollbar reducing the width of the viewport), at 80%.  Someone on a monitor using 1440x900 will see your forum around 1145px wide, as that's roughly 80%.  Using max-width, you can set an upper bounds.  In this case, the content of the forum will be 80% of the user's viewport, up until that value exceeds 1100px, in which case it will stay at that width.  Change it up as you see fit, or remove it!

THAT IS AMAZING!! Thank you soooo mucchh!!!

[Bob]

Apr 25, 2019 16:35:07 GMT -8 @majority said:

Apr 25, 2019 16:25:13 GMT -8 Bob said:

You're going to need to kick the forum's base width up to 100%.  You've done that on the forum in your sig, but the forum you linked to is set to 80%.  Go to Admin > Themes > Advanced Styles & CSS > Forum - Width and change the value of that field to 100%.  From there, we'll use a little bit of CSS to take this home.  Switch over to the Style Sheet tab in that section, and drop this in:

#content {
margin: 0 auto;

width: 80%;
max-width: 1100px;
}

You'll want to change the 80% for whatever you want the width to be.

You can remove the max-width rule if you'd like.  But it can be useful if you want to set a maximum.  For example, someone with a standard 1080p monitor (1920w x 1080h) will see your forum around 1520px wide (accounting for scrollbar reducing the width of the viewport), at 80%.  Someone on a monitor using 1440x900 will see your forum around 1145px wide, as that's roughly 80%.  Using max-width, you can set an upper bounds.  In this case, the content of the forum will be 80% of the user's viewport, up until that value exceeds 1100px, in which case it will stay at that width.  Change it up as you see fit, or remove it!

THAT IS AMAZING!! Thank you soooo mucchh!!!

You're very welcome!