Overlapping Text

Overlapping Text

by Jamie Tinley -
Number of replies: 6

Moodle Moodle 3.7.1+ (Build: 20190712)  Ubuntu 16.04 no gui

HI I read that updating might help for overlapping but the MDL-tracker seemed to be slightly different than my situation so I'm not sure if that's really my problem.  I experience no overlapping if I choose 'Do not Force' in settings but very bad overlapping in waxed, boost, classic.  

Any ideas?Overlapping

Average of ratings: -
In reply to Jamie Tinley

Re: Overlapping Text

by Jamie Tinley -

I tried to fix it by using Git update and now my version of moodle is 

3.7.1+ (Build: 20190816) (2019052001.07)

But sadly I still have the same overlapping text. I tried to purge all caches and restart apache and my server to no avail. 

I am using the latest version of chrome (Version 76.0.3809.100 (Official Build) (64-bit)  and firefox  (68.02 64 bit) so that's not the issue that I know of unless I need to use an older version which I have not tested.

 I love the waxed theme and boost and classic but the overlapping text is really going to frustrate all my teachers.

Any advice would be greatly appreciated. Thanks.

I just saw Mary suggested this code below at the link below but I don't know where to type this css? code

https://moodle.org/mod/forum/discuss.php?d=329028#p1326971

.block_navigation .block_tree .tree_item.hasicon {
white-space: normal;
word-wrap: break-word;
}

Average of ratings: -
In reply to Jamie Tinley

Re: Overlapping Text

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Ok Jamie....

  1. How can I replicate this?  What are the exact steps please?
  2. Do you have any contributed plugins installed?  If so which and versions please?
  3. Have you any custom CSS of your own?
  4. The CSS code you mention almost probably won't solve the problem as described so far.

G

Average of ratings: -
In reply to Gareth J Barnard

Re: Overlapping Text

by Jamie Tinley -
Thanks Gareth for coming to my rescue.
I almost posted it yesterday and thought, easy, steps are choose theme waxed, save, and you see results shown above. But then I realized I need to prove I can duplicate this in another course which I though would be easy. That proved to take all night and all day today removing items one by one and adding them back in and I sometimes got confused which one really caused it until I narrowed it down to a single label. Hard to believe a label could cause this and I would DEARLY like to know why.
Yes I have several 3rd party pluggins like Blackboard Collaborate Ultra, Attendance module, and waxed css code. But I was able to remove all those and produce the same effect.

I have included a backup of a fake class with just the 3 components needed to see this weird effect happen.

To make it easy to see, I created a file with large green text above 2 activities and below it all another label with large red text.
Notice picture 1 shows it's fine using no theme, just choose 'do not force' under appearance which defaults to ??? I thought classic or boost but choosing either of those produces the effect.
Picture 2 is with boost notice the red and green text overlapping the activities and each other (and the admin block if I increase lines of text)
Picture 3 is same bad effect using waxed

I removed line by line the html in the label that caused it until I could have the least amount that still caused this undesired effect. What is in these lines below that causes this problem so I can tell teachers NEVER to use it this way?
Of course when I paste it in It changes it to text here so I guess I'll have to either use a screenshot or maybe I can enclose it in quotes.
"<p><b id="docs-internal-guid-42089d6f-7fff-7be8-1ad6-937baa1c069e"></b></p>
<p></p>
<p></p>
<b><li dir="ltr" style="display: inline !important;">
    <p dir="ltr" style="display: inline !important;"></p><h3><span class="" style="color: rgb(239, 69, 64);">Following the directions in class:</span><br><span class="" style="color: rgb(239, 69, 64);">Create a 2-minute PPT presentation about your interview to present to the class. &nbsp;</span><ol><li dir="ltr"><b><span class="" style="color: rgb(239, 69, 64);">Something&nbsp;</span></b></li>
</ol>
<ol>"

Thanks for your help! Jamie














Bad examples (2, first is boost, 2nd is waxed)






Average of ratings: -
In reply to Jamie Tinley

Re: Overlapping Text

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers
Hi Jamie,

I think it will be this:
style="display: inline !important;"
that is causing the issue. Standard classic copy / paste thing from a word processor. Better to do 'Ctrl + Shift + V' than 'Ctrl + V' as the former removes any formatting and just puts in the text.

G
Average of ratings: -
In reply to Gareth J Barnard

Re: Overlapping Text

by Jamie Tinley -
Thanks Gareth,

I learned something new. I have always used control V and taught all my teachers to use it. I will have to update them with control shift V
Thanks for elucidating the reason!

Jamie
Average of ratings: -
In reply to Jamie Tinley

Re: Overlapping Text

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers
Not the whole story yet Jamie, as I did restore your test course and its 'interesting', got so far then side tracked, need to look at again.
Average of ratings: -