Moodle Theme Help

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?

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

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.

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.

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

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 :/

Quote:

---

Originally Posted by 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 :/

---

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

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.u...hool/style.css

I use the class:

Code:

---

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

---

For the id

Code:

---

main-wrap

---

which surrounds the main part of the page

Or you could use tables lol

<table width="100%">
<tr>
<td class="left"> </td>
<td class="middle"> </td>
<td class="right"> </td>
<td>
<table>

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

Quote:

---

Originally Posted by danIT

Or you could use tables lol

<table width="100%">
<tr>
<td class="left"> </td>
<td class="middle"> </td>
<td class="right"> </td>
<td>
<table>

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

---

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

maybe try adding

Code:

---

#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.

Quote:

---

Originally Posted by mossj

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

maybe try adding

Code:

---

#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

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

<!--HTML-->
<div class="container">
<div class="row">
<div class="cell">CELL A</div>
<div class="cellmiddle">CELL B</div>
<div class="cell">CELL C</div>
</div>
</div>

/*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;
}

Quote:

---

Originally Posted by mossj

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

maybe try adding

Code:

---

#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

Anyone please?

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.