Page 1 of 1
[solved] edit body size
Posted: Thu Jun 26, 2008 10:51 am
by 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
Re: edit body size
Posted: Thu Jun 26, 2008 12:15 pm
by nakkiel
Iframe?
http://www.w3schools.com/TAGS/tag_iframe.asp
...But I have no idea how to load a page inside iframe with CMSMS
Re: edit body size
Posted: Thu Jun 26, 2008 12:51 pm
by 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
Re: edit body size
Posted: Thu Jun 26, 2008 1:19 pm
by 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.
Re: edit body size
Posted: Thu Jun 26, 2008 1:41 pm
by 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
Re: edit body size
Posted: Thu Jun 26, 2008 2:08 pm
by DMR1712
figured it out: for anyone who ever wants a similar thing:
use in your css file:
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!