Moodle in English: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Martin Dougiamas - Tuesday, 10 May 2005, 4:39 PM

There has been a last minute change to the way sideblocks are drawn (thanks PJ!

), in an attempt to improve the block width problems on IE (see http://moodle.org/mod/forum/discuss.php?d=23305 and bug 1718)

Before today blocks were each produced as a table with two cells, one above the other. Now they are a div that contains two smaller divs.

None of the container names have changed - the outer one is still "sideblock", containing "header" and "content".

However, depending on assumptions you have made in your theme you may find some breakage occurring when you next update Moodle 1.5 dev.

Sorry about the last-minute hassle, but better now than after 1.5 is released!

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Urs Hunkler - Tuesday, 10 May 2005, 4:54 PM

I could get my theme working again with two small changes:

The header color showed up again by defining a height:

.sideblock .header {
 height:2em;
 ...
}

The sideblock content went back into the sideblock (sitting beside it after the changes of the sideblock structure) by adding clear:both:

.sideblock .content {
 clear:both;
 ...
}

I hope it's of some help.

[Urs CSS]

Average of ratings: Useful (1)

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by John Papaioannou - Wednesday, 11 May 2005, 12:59 AM

Urs, if you take a close look you will see that in the process I simplified the floating element structure somewhat. Specifically, since the collapse +/- icon and the move/delete/config icons were being displayed as an ugly mess when editing on, I moved the m/d/c icons in a separate row.

Also, the header doesn't float anymore, which means that there's no need to clear any elements also. And the "collapsed header" issue (which forced you to give it an explicit height) probably means that in your theme, some elements are still floated (if you mean orangewhite, then I can see they are indeed).

Just remove all the floating except for this:

.sideblock .header .hide-show {
float:right;
}

and it should be fine, as it is in standard.

Average of ratings: Useful (1)

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Urs Hunkler - Wednesday, 11 May 2005, 2:00 AM

Hi Jon,

thanks for the details. I'll give the sideblocks a second look.

Urs

Average of ratings: Useful (1)

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Vu Hung - Tuesday, 10 May 2005, 4:57 PM

That's great. Now block's width problem is solved. But is there a small problem with the border of the block? Please look at the right border.

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Martin Dougiamas - Tuesday, 10 May 2005, 5:10 PM

I'm not seeing that ... make sure you reload the stylesheets by holding down the Control key while you click Refresh.

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Vu Hung - Tuesday, 10 May 2005, 5:23 PM

I make sure that I refreshed the pages many times. One more picture:

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Martin Dougiamas - Tuesday, 10 May 2005, 5:28 PM

Hmmmm, wierd, you are missing shading and borders too ... this is how it looks for me in IE 6.

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Vu Hung - Wednesday, 11 May 2005, 1:15 AM

I tested with IE6s of Windows XP Pro and Windows 2003 enterprise. But they all have the same problem with borders and shading. IE is very strange, isn't it?

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Vu Hung - Wednesday, 11 May 2005, 4:20 PM

Hi Martin,

Did you test Moodle with IE6 on another operating system, not Windows. Your screen is so different from mine .

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Martin Dougiamas - Wednesday, 11 May 2005, 8:36 PM

IE6 only runs on Windows. I just use a Mac OS X theme in Windows to make the windows look and work better, but this doesn't affect how IE renders web pages. So I assume you still have this problem?

I can't explain it.

Incidentally I noticed in these screenshots how bad the login box looked, and fixed that today.

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Vu Hung - Wednesday, 11 May 2005, 9:24 PM

Not only me, others saw that problem too.

Did you read the post: http://moodle.org/mod/forum/discuss.php?d=23566? wink

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Martin Dougiamas - Wednesday, 11 May 2005, 10:39 PM

OK, what about others using IE?

We really need some solutions for this from someone! (I can't solve it because it works for me)

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Jeffery Watkins - Wednesday, 11 May 2005, 11:11 PM

My site was looking ok in IE also.

http://www.classroomrevolution.com/moodle15/moodle

Jeff

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Vu Hung - Thursday, 12 May 2005, 3:01 AM

Hi Jeff,

My Moodle 1.5 courses are Ok under IE6. I mean when you use IE6 and connect to http://moodle.org, then see if there's the same problem as above. We have just changed some code of moodle.org recently to fix the block's width problem.

Cheers,

Vu Hung

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Shane Elliott - Thursday, 12 May 2005, 7:46 AM

Working for me with IE6 ... although as always it just feels better with Firefox wink

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Ferdy Lim - Thursday, 12 May 2005, 11:56 AM

Yes I found the same problem with Vu Hung as below:

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Martin Dougiamas - Thursday, 12 May 2005, 1:50 PM

I asked Ferdy to clear his cache completely and it worked for him. Vu, can you try it?

IE: Tools -> Options -> Temporary files -> Delete files

Holding down Control key while pressing refresh should have worked too (it does for me) but IE is notorious for buggy and overzealous caching.

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Vu Hung - Thursday, 12 May 2005, 2:23 PM

>>IE: Tools -> Options -> Temporary files -> Delete files

That's a great tip, Martin. Now, it worked for me. In my mind, refreshing is enough (as my own experiences). So what's actually wrong with IE? Could somebody explain this?

Martin, should we put this tip in FAQ?

Cheers,

Vu Hung

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Martin Dougiamas - Thursday, 12 May 2005, 2:29 PM

Your browser was keeping and using old copies of the moodle.org stylesheets rather than using the current ones that match the new HTML produced.

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Ferdy Lim - Thursday, 12 May 2005, 2:52 PM

Yes It's fixed!

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by John Papaioannou - Thursday, 12 May 2005, 7:10 PM

Who would have thought... and I was wracking my brain for what might be going on!

Where do they accept applications for the "I love IE" club? tongueout

Incidentally, I 'm working on some JavaScript that runs once after the page loads and fixes the problem of non-uniform block sizes for IE. Not 100% robust yet though.

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Urs Hunkler - Thursday, 12 May 2005, 8:16 PM

Jon, are you going to programm the firefox add-on for IE?

Urs

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by John Papaioannou - Thursday, 12 May 2005, 11:32 PM

No, I 'll just settle for a few neat JS tricks. wink

Speaking of which, it's in CVS now. When moodle.org or test.moodle.com get updated we can test it with lots and lots of IE users.

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Martin Dougiamas - Friday, 13 May 2005, 12:37 AM

.... I think I'd rather have IE looking slightly off (actually I thought the last changes had them pretty good) than running Javascript on every page.

That said it's here and doesn't seem to be breaking anything!

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by John Papaioannou - Friday, 13 May 2005, 4:56 AM

I 'm OK with pulling it out; I 'm not going to visit any page for my viewing pleasure using IE for sure. wink

The reasoning behind this though was as follows:

We can do absolutely nothing to have the problem fixed in IE while at the same time keeping a pixel-specified width for the side columns. If it's one thing I 'm convinced of, it's this.
Without the "hack", teachers (or even students, when My Moodle starts allowing them to add blocks by themselves?) are mathematically sure to at some point add an overwide image. And they won't all be tech-savvy.
Result: "Moodle's fault". I 'm talking about people who won't know that there is an alternative to IE (and wouldn't care even if they knew). Why not keep them blissfully unaware of what's going on until IE 7 comes out with an improved rendering engine (dream on...) and the whole universe upgrades?
Finally, anyone who is savvy enough to actually see what's going on behind the scenes will definitely nod instead of complaining.

That said, if you believe it's doing harm I 'm still OK with pulling it out. I was just having one of my "haven't said my last word yet" fits. tongueout

On a related note, while hacking away I noticed that it's very hard for someone who wants to modify the core to insert something in body onload="". So hard that I didn't do it that way.

In fact, not only you have to have control over all calls to print_header (which you may not have, as in this case) but also a quick inspection left me with the impression that if you do insert something and at the same time use the auto-focus feature, the result will be exactly equal to one Javascript error at worst (and your onload will not simply not work at best).

We can do two things to remedy this:

Pre-emptively have onload call a predefined function anyway, in addition to anything else. This will at least allow people who want to insert their own Javascript an easy entry point (just add your code to the empty by default function).
Build a better system for adding onload stuff. And an easier way to specify the attributes of <body> incrementally while we 're at it. The $PAGE object would be good for this, and we don't need to refactor the world. Just build the support into page_base and then slowly move things that way while working on Moodle 1.6.

This came out quite long, didn't it? wide eyes

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Petr Skoda - Friday, 13 May 2005, 5:22 AM

I have been fighting onload too when messing with the chat module

This problem seems similar to "global $course" hack used for setting up of course language. As I said before somewhere I would like to see a new init() function called in each script before first text output - we could setup course language, themes and other ugly hacks (== browser workarounds) there.

skodak

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Martin Dougiamas - Friday, 13 May 2005, 10:30 AM

No specific complaints from me! Just my generic aversion to complexity caused by repeated exposure to unexpected support problems.

I'm totally OK with keeping this hack - it seems to be working very well so far and it *is* a neat trick.

And yes, you know I totally agree with moving everything over to the $PAGE class over time.

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by T K - Friday, 13 May 2005, 2:54 PM

Hello,

see Posting above (from Jon):
Today I've found a solution for non-uniform blocksizes and other MSIE-CSS-Problems

See MSIE 7: http://dean.edwards.name/IE7/overview

I'm going to test it. May be, its a good idea, to integrate this into moodle.

Tobias

Average of ratings: Useful (1)

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Jeffery Watkins - Tuesday, 10 May 2005, 8:49 PM

I am having this problem with all of my themes, including the Standard.

Any ideas?

Jeff

Average of ratings: -

Re: Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

by Martin Dougiamas - Tuesday, 10 May 2005, 8:56 PM

I think you may not have a completely up-to-date copy of the code - I've messaged you about it.

Average of ratings: -