IE Image Resize Problems / News Feed Formatting (Essential 2.7)

IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Andrew Stewart -
Number of replies: 14
Hi all - I'm having a couple of problems with html in Essentials 2.7 (Build: 20140203). Moodle version 2.6.2 (20140310) (we are updating to 2.7 soon)

I'm not sure if it's also an issue with the clean install or if we've done something to break it, but either way I thought someone on here may know where we've gone wrong.

Problem 1

In Internet Explorer (I know...) images don't seem to conform to the html size set. For example in this post, we have text on the left and an image on the right. This is the html:

<img style="float: right;" src="http://moodle.southwirral.wirral.sch.uk/draftfile.php/29006/user/draft/571960449/39%20%281%29.jpg" alt="" width="166" height="104" />It is your Paper 2 American West exam on Friday. There will be a final revision session on Wednesday lunchtime in P11, P12, P13,P14 with your teacher.

In Chrome it displays like this:

chrome

and in IE:

ie


Problem 2 -

When formatting on the front page (news feed), bold does not show up correctly when posted.

In editor:



In post:



So does anyone know how to get it so IE will listen to the size set by html, and if there is a fix to keep the bold? Bold works fine in courses.

Many thanks
Average of ratings: -
In reply to Andrew Stewart

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

You didn't tell us which 'theme'  you are using and also which version of IE.

If you are using Clean theme then try adding img-responsive to your HTML for the image class. So where you have this...

<img style="float: right;"

add this...

<img class="img-responsive" style="float: right;"

and see if it fixes the problem.

In reply to Mary Evans

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Andrew Stewart -

Is Essential 2.7 not the theme? And it's IE10, sorry forgot that bit!

HTML addition didn't work sad 

The bold issue is in every browser, not just IE10

In reply to Andrew Stewart

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

My apologies, for some reason I missed the theme name but focused on 2.7 and so just assumed a Moodle standard theme as you are still on 2.6

To rule out Moodle as being the problem can you test the forum post s Bold & image problems using any other Moodle theme like Afterburner or Standard themes?

In reply to Mary Evans

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Andrew Stewart -

Sorry for the late reply - we've been on half term! Checked a few other themes including those two and the problem goes away so it seems to be an Essential-specific issue

In reply to Mary Evans

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Andrew Stewart -

I've just installed a fresh install of the same Essentials build on a test server (Moodle 2.6.2) and the bold issue isn't there (so that's something I must have altered) however the image resizing to 100% remains.

Does anybody else get the resize problem? I know IE is satan but there must be a fix?

Also, any ideas what files I should be looking at that may have crocked the formatting so bold doesn't work? Painstakingly trying to compare the files now. I've realised its not just the front page feed, it's formatting in all forum posts. In fact when making THIS TEXT HERE in the forum bold, it's doing the same here?? (at least it's not appearing bold at my end)... I'm super confused

In reply to Andrew Stewart

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Have you tried to add the class selector which I posted earlier in a comment in this discussion thread?

class="img-responsive" ... 

For example (using your original example explanation of the problem) ...

<img class="img-responsive" style="float: right;" src="http://moodle.southwirral.wirral.sch.uk/draftfile.php/29006/user/draft/571960449/39%20%281%29.jpg" alt="" width="166" height="104" />It is your Paper 2 American West exam on Friday. There will be a final revision session on Wednesday lunchtime in P11, P12, P13,P14 with your teacher.

In reply to Mary Evans

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Andrew Stewart -

Thanks Mary, tried that and didn't work. Also ideally looking for something we can do at the back end as it will mean an IT technician having to edit posts every 5 minutes for less tech-savvy teachers

In reply to Andrew Stewart

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Well the problem for me is that I cannot test IE10 as my PC does not support it, at least it is looking that way!

If the image looks OK in Clean theme (did you check Clean theme for this problem?) then it must be some code in Essential that is causing the problem.

Another cause could be that your school network may be changing the way IE is rendereing the page in other words is throwing it into 'Compatibility Mode' to test that this is the case do the following:

  1. Using IE10 click F12 (Function Key F12 which can be found as the top most row of keys above the numbers).
  2. This brings up a Web Developer window at the bottom half of your screen.
  3. At the point where the split occurs you should see a menu bar at the end of which you should see two menu items Browser Mode IE10 and Document Mode: IE10 Standards
  4. If you don't see this please tell me what you do see?

Thanks

Mary

In reply to Mary Evans

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Andrew Stewart -

Leaving work now but will report back tomorrow! Many thanks - really do appreciate the help

In reply to Mary Evans

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Andrew Stewart -

It looks like it's this problem, found in another thread:

https://moodle.org/mod/forum/discuss.php?d=252418

We're trying an upgrade of Moodle today so will let you know if that works. Just the bold issue now - is this text here showing up as bold to you? As every bit of supposedly bold text within this forum is just displaying slightly more spaced out to me.

In reply to Mary Evans

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Andrew Stewart -
Update seems to have fixed both problems! :D thanks again 
In reply to Andrew Stewart

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Thank goodness for that, I was just about to recommend you visit your optician!

And YES the 'bold text' in the forum is indeed BOLD.

Cheers

cheers

Mary

In reply to Mary Evans

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

by Andrew Stewart -

Me again! Just updated to 2.9.5 and it seems to have started doing the IE image resize problem again - looks like from my above comment that the update to a previous version fixed it, so has something related been modified in this update?

In reply to Andrew Stewart

Re: IE Image Resize Problems / News Feed Formatting (Essential 2.7)

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

Ok, assuming that 2.9.5 is the version of Moodle, what is the version of Essential please?

As things have changed, please re-describe with screen shots the problem so that there is no confusion.