HTML text attributes don't display properly (Moodle 2.0.1)

HTML text attributes don't display properly (Moodle 2.0.1)

by Orestes Mas -
Number of replies: 4
Picture of Translators

I've both "emphasized" (italic) and "strong" (bold) text in several places (labels, quizzes introdutctory text, etc.). But he text attributes aren't properly displayed: Text is displayed either bold or italic, but no both, depending on the order of which attributes were selected.

 

For instance, the HTML code:

<p><strong><em>Simple emphasized and strong text (in this order)</em></strong></p>
<p> </p>
<p><em><strong>Simple strong and emphasized text (in this order)</strong></em></p>

is correctly displayed within the HTML editor, but is displayed erroneously in its final place, as shown in the image attached (side problem: I don't find how to attach more than one file to this forum post. The "add" button disappears when I attach the first one. sad ).

If I inspect the generated HTML code with firebug, I can see the 2 HTML tags are present, so maybe it's a CSS problem?

I've tried it with 3 or more standard themes, with identical results.

Attachment bug1.png
Average of ratings: -
In reply to Orestes Mas

Re: HTML text attributes don't display properly (Moodle 2.0.1)

by Orestes Mas -
Picture of Translators

I've just done some more tests, and the problem affects this site too. Look at these examples:

This sentence has <strong> and <em> attributes

This sentence has <em> and <strong> attributes

When displayed inside the forum by my web browser, the first sentence looks only emphasized (italics) and the second only strong (bold). But if you inspect the underlying HTML code you'll see the two tags are correctly present.

Orestes.

Average of ratings: -
In reply to Orestes Mas

Re: HTML text attributes don't display properly (Moodle 2.0.1)

by Lynn Scarlet Clark -

Hello Orestes,

Please can you say what version of Moodle you are using and maybe post or attach an example of a block of HTML text that you have tried to code (ie all the code, not just the text). What browser (and version) are you using too?

 

Average of ratings: -
In reply to Lynn Scarlet Clark

Re: HTML text attributes don't display properly (Moodle 2.0.1)

by Orestes Mas -
Picture of Translators

Hello Scarlett, thanks for replying.

I'm using the latest moodle version (2.0.1+) running on an own server. I'm accessing it mainly with linux and firefox, but i've tried also other setups like windows and ie, with similar results.

Regarding the block of HTML text you are asking for, you can find a simple example just in this forum, inside my last message.

Anyway, this morning, after a couple of hours, I've been able to track the problem down to the "yui" library used by moodle. The fact that other tags like <sub> and <sup> weren't also correctly displayed gave me the clue: inspecting the CSS code with firebug showed that "sub" attributes were defined as:

sub {vertical-align:text-bottom;}

which is clearly wrong. Similar for "sup" tag. So i modified the culprit file (lib/yui/3.2.0/build/cssreset/reset-min.css) deleting these wrong definitions and the ones involving "em" and "strong" too. Funny enough, it worked!

I don't know if this is the best solution. Probably it would require a lot of polishmeny by moodle experts. But it works for me.

Here is the patch, for anyone interested:

=== modified file 'lib/yui/3.2.0/build/cssreset/reset-min.css'
--- lib/yui/3.2.0/build/cssreset/reset-min.css  2011-02-07 11:01:10 +0000
+++ lib/yui/3.2.0/build/cssreset/reset-min.css  2011-02-07 11:22:29 +0000
@@ -5,4 +5,4 @@
 version: 3.2.0
 build: 2676
 */
-html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}
\ No newline at end of file
+html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}

Orestes.

 

EDITED:  There's a bug report related to this bug: MDL-25434

Average of ratings: -
In reply to Orestes Mas

Re: HTML text attributes don't display properly (Moodle 2.0.1)

by Lynn Scarlet Clark -

Hi Orestes,

Sorry no one got to you sooner, but congrats on working out your own fix (there's nothing like the glow of self-satisfaction that comes from working out your own issues!!) Please add your patch solution to the bug tracker, as I am sure that (as well as searching the fourms and finding the solution here) that it will benefit many Moodlers.

Average of ratings: -