[solved] edit body size

[DMR1712]

Hello everyone,
I'm just trying CMSMS for the first time and I'm already impressed. While tweaking the layout I came across the next "problem":

I want to limit the size of the body, so it's for example 500px x 500px. When the content is larger than this size, the body is not supposed to resize accordingly, but stay this size and have a scrollbar to scroll down the content.

Is this possible and if so, can anyone point me in the right direction?
I'm using the newest version of CMSMS (just upgraded) and use a template called "Nichess" which I found in the themes site.

Thanks for any help you can give me!
DMR

[nakkiel]

Iframe?
http://www.w3schools.com/TAGS/tag_iframe.asp

...But I have no idea how to load a page inside iframe with CMSMS

[DMR1712]

Hmm I don't think I was clear enough, since an iFrame is something really different from what i meant.

I mean the body of cmsms, for example this forum: the white part in which all the text and stuff are located. I want to give this block a set value, so the screen cannot scroll down.

I hope this is a bit clearer?
Thanks again!
DMR

[KO]

This is pretty basic CSS thing and you can get more info about CSS from http://www.w3schools.com/css/default.asp . Usually you give width (and/or height) to first inside body tag. Browsers behave differently with margins and paddings so give that div also padding:0; margin:0 . overflow-y:auto makes verticall scrollbar to that div when more content. Best place to get CSS info is dedicated CSS forum or Google.

[DMR1712]

I understand I need to alter the css, I think I found the file in which to do this. Here I max the height of the center wrapper

Code: Select all

/* center wrapper, min max width */
div#pagewrapper {
   border: 1px solid #fff;

   margin: 3em auto;       /* this centers wrapper */
   max-width: 60.1em;   /* IE wont understand these, so we will use javascript magick */
   min-width: 60.1em;
max-height: 60.1em;
min-height: 60.1em;
   background-image:url(uploads/nichess/01_bg.gif);
   color: black;
}

AND

Code: Select all

div#main {
   margin-right: 33%; /* this will give room for sidebar to be on the right side, make sure this space is bigger than sidebar width */
   margin-left: 2%; /* and some air on the left */
background-color: #fff;
padding: 0.6em;
height:532px;

}

However, the content  (the words)just keeps on going down the page, so I thought to change this piece:

Code: Select all

div#content {
border: 1px solid #000;
   margin: 1.5em auto 2em 0;   /* some air above and under menu and content */

}

but that doesn;t work. Any ideas?

If you want to take a look at what I mean:

http://tinyurl.com/5psldx

[DMR1712]

figured it out: for anyone who ever wants a similar thing:

use in your css file:

Code: Select all

overflow:auto;

It isn't what I had in mind, so I don't know if I'll use it, but at least I know a little more now!