Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

Alert: Change in 1.5 Sideblocks: TABLE -> DIVS

por Martin Dougiamas -
Número de respostas: 30
Imaxe de Core developers Imaxe de Documentation writers Imaxe de Moodle HQ Imaxe de Particularly helpful Moodlers Imaxe de Plugin developers Imaxe de Testers
There has been a last minute change to the way sideblocks are drawn (thanks PJ! sorriso), 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!
Media de puntuacións: -
En resposta a Martin Dougiamas

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

por Urs Hunkler -
Imaxe de Core developers

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]

Media de puntuacións:Useful (1)
En resposta a Urs Hunkler

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

por John Papaioannou -
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.
Media de puntuacións:Useful (1)
En resposta a John Papaioannou

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

por Urs Hunkler -
Imaxe de Core developers

Hi Jon,

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

Urs

Media de puntuacións:Useful (1)
En resposta a Martin Dougiamas

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

por Vu Hung -
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.
Anexo Boundary.jpg
En resposta a Vu Hung

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

por Martin Dougiamas -
Imaxe de Core developers Imaxe de Documentation writers Imaxe de Moodle HQ Imaxe de Particularly helpful Moodlers Imaxe de Plugin developers Imaxe de Testers
I'm not seeing that ... make sure you reload the stylesheets by holding down the Control key while you click Refresh.
En resposta a Martin Dougiamas

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

por Vu Hung -
I make sure that I refreshed the pages many times. One more picture:
Anexo MoodleOrg.jpg
En resposta a Vu Hung

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

por Martin Dougiamas -
Imaxe de Core developers Imaxe de Documentation writers Imaxe de Moodle HQ Imaxe de Particularly helpful Moodlers Imaxe de Plugin developers Imaxe de Testers
Hmmmm, wierd, you are missing shading and borders too ... this is how it looks for me in IE 6.
Anexo ie6.png
En resposta a Martin Dougiamas

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

por Vu Hung -
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?
En resposta a Martin Dougiamas

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

por Vu Hung -

Hi Martin,

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

En resposta a Vu Hung

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

por Martin Dougiamas -
Imaxe de Core developers Imaxe de Documentation writers Imaxe de Moodle HQ Imaxe de Particularly helpful Moodlers Imaxe de Plugin developers Imaxe de Testers
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? triste I can't explain it.

Incidentally I noticed in these screenshots how bad the login box looked, and fixed that today.
Anexo ie6.png
En resposta a Martin Dougiamas

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

por Vu Hung -

Not only me, others saw that problem too.

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

En resposta a Vu Hung

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

por Martin Dougiamas -
Imaxe de Core developers Imaxe de Documentation writers Imaxe de Moodle HQ Imaxe de Particularly helpful Moodlers Imaxe de Plugin developers Imaxe de Testers
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)
En resposta a Martin Dougiamas

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

por Jeffery Watkins -
En resposta a Jeffery Watkins

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

por Vu Hung -

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

En resposta a Vu Hung

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

por Ferdy Lim -
Yes I found the same problem with Vu Hung as below:
Anexo ssssssssss.jpg
En resposta a Ferdy Lim

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

por Martin Dougiamas -
Imaxe de Core developers Imaxe de Documentation writers Imaxe de Moodle HQ Imaxe de Particularly helpful Moodlers Imaxe de Plugin developers Imaxe de Testers
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.
En resposta a Martin Dougiamas

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

por Vu Hung -

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

En resposta a Vu Hung

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

por Martin Dougiamas -
Imaxe de Core developers Imaxe de Documentation writers Imaxe de Moodle HQ Imaxe de Particularly helpful Moodlers Imaxe de Plugin developers Imaxe de Testers
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.
En resposta a Ferdy Lim

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

por Ferdy Lim -
Yes It's fixed!
En resposta a Ferdy Lim

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

por John Papaioannou -
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.
En resposta a John Papaioannou

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

por Urs Hunkler -
Imaxe de Core developers
Jon, are you going to programm the firefox add-on for IE? chiscadela

Urs
En resposta a Urs Hunkler

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

por John Papaioannou -
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.
En resposta a John Papaioannou

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

por Martin Dougiamas -
Imaxe de Core developers Imaxe de Documentation writers Imaxe de Moodle HQ Imaxe de Particularly helpful Moodlers Imaxe de Plugin developers Imaxe de Testers
sorprendido .... 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. mesturado

That said it's here and doesn't seem to be breaking anything! coa lingua fóra
En resposta a Martin Dougiamas

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

por John Papaioannou -
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:
  1. 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.
  2. 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.
  3. 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?
  4. 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:

  1. 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).
  2. 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
En resposta a John Papaioannou

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

por Petr Skoda -
Imaxe de Core developers Imaxe de Documentation writers Imaxe de Particularly helpful Moodlers Imaxe de Peer reviewers Imaxe de Plugin developers
I have been fighting onload too when messing with the chat module chiscadela

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
En resposta a John Papaioannou

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

por Martin Dougiamas -
Imaxe de Core developers Imaxe de Documentation writers Imaxe de Moodle HQ Imaxe de Particularly helpful Moodlers Imaxe de Plugin developers Imaxe de Testers
No specific complaints from me! Just my generic aversion to complexity caused by repeated exposure to unexpected support problems. gran sorriso

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.
En resposta a Urs Hunkler

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

por T K -
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



Media de puntuacións:Useful (1)
En resposta a Martin Dougiamas

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

por Jeffery Watkins -
I am having this problem with all of my themes, including the Standard.

Any ideas?

Jeff
Anexo blocksexample.jpg
En resposta a Jeffery Watkins

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

por Martin Dougiamas -
Imaxe de Core developers Imaxe de Documentation writers Imaxe de Moodle HQ Imaxe de Particularly helpful Moodlers Imaxe de Plugin developers Imaxe de Testers
I think you may not have a completely up-to-date copy of the code - I've messaged you about it.