[css] Moodle Theme Help

[FN-GM]

Hi,

 

I have pulled apart the Moodle clouds theme. I would like it to that the page will go to a width of 1280 but when displayed on a higer Res screen i would like to to display the background.

 

After much messing arround i cannot find how do change it. Can anyone advise please?

styles_clouds.css.txt

[ctaylor2]

Designing for variable width monitors can always be a problem.

 

Could you be a little clearer with what your problem is. When you say you would like to display the background do you mean that the background image is not repeated correctly?

 

I'm not familiar with the theme, could you provide a screenshot or preferably a live link so I can have a tinker.

 

Thanks

[FN-GM]

The background is a solid colour.

 

We have alot of wide screen computers around school. Currently them theme is set to stretch to the size of the screen. But the problem with this is that it is causing the header to repeated itself as it is not long enough. I want it so it will resize freely on the display until it gets 1280px wide then it wont go any wider

 

Thanks allot.

[ctaylor2]

Ah, got you.

 

Without seeing a live version of the page it's a little difficult to say what might be causing the problem as I can't see which classes apply to what.

 

I can see a that the id 'page' and 'page-home' have a min-width: 920px. This means anything over 920px wide it will expand.

 

Try changing it to max-width: 1280px.

 

The only prob with that though is I don't think IE6 supports min/max widths.

Edited July 29, 2009 by ctaylor2

[ctaylor2]

Found a hack to enable max-width in ie6 here if you want to use it: min/max-width fix for IE6 - CSS - Snipplr

[apoth0r]

On a similar not with the same theme, how do i get it to centre the main window, at the moment i'm kind of going to one side :/

[FN-GM]

On a similar not with the same theme, how do i get it to centre the main window, at the moment i'm kind of going to one side :/

 

I couldn't find that, that why i ended up making it stretch.

[ctaylor2]

To make your content centre you can use margin: 0 auto. You need to specify a width to make this work though.

 

If you look at the css for my site: http://www.bolsover.derbyshire.sch.uk/wp-content/themes/bolsoverschool/style.css

 

I use the class:

 

.centred {
margin:0 auto;
width:880px;
}

 

For the id

main-wrap

which surrounds the main part of the page

[danIT]

Or you could use tables lol

 

td.left { background: url("left.png") repeat-x; } etc....

[mossj]

Or you could use tables lol

 

td.left { background: url("left.png") repeat-x; } etc....   No bad! W3 doesn't like tables for layouts.   maybe try adding   #ID { min-width: 980px; max-width: 1280px; width: 85%; margin-left: auto; margin-right: auto; }   This will make the min-width 980px, then up until 1280px it will take up 80% of the screen, but when it hits 1280px it won't expand further. It should also center it throughout.

Edited July 29, 2009 by mossj

[FN-GM]

No bad! W3 doesn't like tables for layouts.

 

maybe try adding

 

#ID {
min-width: 980px;
max-width: 1280px;
width: 85%;
margin-left: auto;
margin-right: auto;
}

 

This will make the min-width 980px, then up until 1280px it will take up 80% of the screen, but when it hits 1280px it won't expand further. It should also center it throughout.

 

Thanks, how would i put this into the CCS file?

 

Thanks

[danIT]

Sorry, here's another way, not sure if its valid but it works

 

CELL A

CELL B

CELL C

 

/*CSS

.container {

display: table;

}

 

.row {

display: table-row;

}

 

.cell {

display: table-cell;

width: 10%;

height: 100px;

border: 1px solid blue;

padding: 1em;

}

.cellmiddle {

display: table-cell;

width: 90%;

height: 100px;

border: 1px solid blue;

padding: 1em;

}

[FN-GM]

No bad! W3 doesn't like tables for layouts.

 

maybe try adding

 

#ID {
min-width: 980px;
max-width: 1280px;
width: 85%;
margin-left: auto;
margin-right: auto;
}

 

This will make the min-width 980px, then up until 1280px it will take up 80% of the screen, but when it hits 1280px it won't expand further. It should also center it throughout.

 

Thanks, managed to twig a place for it.

 

 

Does anyone know how to set a maximum width for a forum post?

 

Thanks

[FN-GM]

Anyone please?

[danIT]

Something along the lines of..........

 

TABLE .forumpost {

width: 100%;

}

 

Think you'll then need to play around with the forum post headings to get the display you want.

 

Do you have the web developer toolbar for FF installed, its very useful.