MyBB Community Forums

The problem here is quite minor and to someone with more experience than me may be quite easy to fix. I'm not quite sure where I should be looking to fix it though.

I'm using Apart Water on MyBB 1.6

Normally the site works fine but one of my set up staff noticed that when a box is set smaller than the width of the forum the bit you can't see doesn't display properly.



For an example test it here,

http:// http://www.msadventdestiny.com/

You can't access the site yet but if you shrink your browser window until the scroll bar appears across the bottom, then scroll to the right you'll see that there is nothing there. On the default skin a scroll bar will never appear, so this if this was a problem you wouldn't be able to see it anyway.

What I would like to do is set my forum so that you could scroll across and use it should a user want to. Failing that remove the ability to scroll so that no one can see it anyway.

I've tested this on a few sites and the problem doesn't just happen with ours, you can test a few other sites that use the Apart theme and they seem to have the same problem.

Sorry if they don't want me to show it but

http://fireforums.net/

Does the same thing if you shrink the page.

This makes me think its a problem with the wrapper in Apart themes but I don't know enough to anything other than think it. Could anyone shed some light on to where I need to be looking and what I need to change?

Open the themes global.css

Find the .wrapper class, change the width to 100% and remove:

min-width: 970px;

That is a solution and thank you very much,

I would like it if I could keep the area of content to either side though, and if possible be able to stop the page compacting too much. This forum manages to do it but I can't find the code to do so in the default template.

Not 100% sure I understand what you want to do. Do you mean the padding around edges?

If so, try the following edits in global.css

#content, find:

padding: 20px 10px;

Replace with:

padding: 20px 20px;

#logo, add:

padding: 0 20px;

#panel .upper, find:

padding: 7px;

Replace with:

padding: 7px 20px;

#panel .lower, find:

padding: 5px;

Replace with:

padding: 5px 20px;

Does that do what you want?

First of all thanks for putting up with me,

The changes you've suggested, not that I'm not grateful, just make the problem less noticeable rather than fix it.

Thanks to you I can now set the forum so that it'll resize the smaller you make it so its harder to bring about the conditions for the edge of the page. However I'd like to put a limit on that so that you can't make it so small everything runs together. So when it gets to a set size a scroll bar would appear so all the content is still readable even if shrunk.

Normally this would be done I think by

min-width: 970px;

So I can't really remove that and keep a minimum can I? (unless I misunderstand)

Even with all your changes if it gets too small the bit off screen still disappears.

I've discovered that removing the

overflow: hidden;

From the Global sheet lets the forum boxes and some other parts appear in the hidden area when you scroll back across. However the graphic for the second header bar (the one with the CPs on) will vanish and the background, header and other elements don't have such code and still don't carry over.

What I would like is shown by the MyBB forum,

You can shrink the page but as soon as it starts to effect the layout a scroll bar appears. That seems the default setting for my forum, except when you try and scroll to the right, you can't see the items that were there. All are hidden. As shown in the first image.

Edit,

I've removed the changes you've given to make the issue more noticeable,

A normal page,


What the page looks like when browser is resized and what it looks like when you scroll to the right.

Why are you browsing on such small resolutions in the first place?

I'm not.

Its someone on my forum who is using lots of small windows on their computer and its an easy way to reference information as you write replies.

Regardless,

It looks quite unprofessional and I don't really know why it would do something like this, if it was overlooked because its unusual to do so then its worth pointing out.

If its not part of the global.CSS where else should I be looking to make changes?

I don't think there's a way round this because the menu items simply won't fit in a window that small. Whatever you do it's going to cause something to go out of wack somewhere.

I can set the page so that the theme can't shrink too much, that's easy.

I just want it so that the bit you can't see without scrolling doesn't disappear. Else setting the pages so they don't shrink too much is pointless. Because you can't scroll to see it.

Without the changes that you gave it works fine with any window size and doesn't change too much, unless you want to scroll to see bits off the edge of what you are viewing. Which is my original problem, how do I stop the theme hiding the bits that you can't see?

edit-

Note that the last image, everything works perfectly fine, other than the fact that you can't see the bits that are just off the screen in window mode. Just try it and see on the links I gave, its quite simple. All the parts work fine, other than its all cut off and you can't see it.

(2010-08-11, 02:05 PM)AJS Wrote: [ -> ]Open the themes global.css

Find the .wrapper class, change the width to 100% and remove:

min-width: 970px;

SOLVED!

Great tip AJS!

I wasn't aware this was an issue, I'm glad Lunamaria pointed it out since I use the Apart theme.

The one thing I do need to fix now is my header/logo, how do I make my header/logo centered?

When I test out other screen resolutions like 1152 x 864 or 1280 x 768 for wide screens my header/logo is way to the left.

I use an image so its really noticeable.

Any tips on how to fix that?

Thanks.

Btw, i am still working on my sidebar

Update: I found the answer here
http://mybbsource.com/thread-3836.html