Moving my Vivaldi choir pages to use .php to include for common elements as per Mayne Island Conservancy (see open question from 3 days ago) & have noticed some anomolies in IE 11.
Any help would be appreciated on this and my open query on "Mobile Display" I intend to donate for both solutions! Thank you!

2 screen shots tell the story - 1 for Firefox/Chrome & 1 for IE11 vivie11.pngvivchromeff.png

Member Avatar for diafol

Just a tip. Please keep threads separate if possible. The opening post is a bit confusing.

So what you're saying is that <strong> is not rendered properly and the sidebar is incomplete. OK. That's what we need to know. Showing the relevant HTML and CSS could be useful too, but as you've posted a link, that should suffice for now.

Member Avatar for diafol

Both loaded OK for me, although the links in the footer were all over the place in IE. Possibly due to a big image being loaded on page load or something? Check the size of your images.

Have a look at the console as you have a number of warnings e.g. more than one body tag.

Tks Diafol - I've checked for multiple body tags and only find a single pair and the editor I use doesn't seem to show any errors (Active State Komodo Edit 8.5 - not the full development environment) so I'm a bit lost when you refer to the "Console"

To zero in on the problem that I now understand a bit more - the text in the in-floating caption for the slideshow renders left-align in Firefox/Chrome but IE "newspaper justifies" it, so nothing to do with the strong tag after all.

So the question is why this happens? Would like to pursue this one and post on the sidebar peculiarities later. Thanks to you and "priteas" (sp?) for previous help with these 2 sites!

Alan

PS Please let me know if I should post any excerpts from the CSS etc.

Diafol - yr msg about "Console" got me realising that there was something available for Firefox that I didn't know about. So, thanks, I now have the develper tool bar and am slowly going thru the Validator. If I make corrections per the validator and my issue goes away I will mark this as solved. If not I will report that I'm still looking for help!

Member Avatar for diafol

Just checking devtools again. You have a huge number of calls to external files - loads of js, css, image files. You're also using an iframe, which seems to be taking a long time to load.

audit2.PNG

Not sure what's going on with your placeholder.html files, but you're making calls to jQ and css again in them.

Thanks for the further evaluation. Also for the tip about the Console. Indeed it seems that my DOCTYPE declarations (picked from various templates adopted along the way) have implied XLMNS and HTML 5.0 and scattered throughout my pages are some Five-ey stuff, E.G. < /br>, but a lot that I understand is not compatible with HTML 5. Accordingly I am changing the declaration to 4.01 transitional and then stripping all the < /> terminators (incl < /br>)

However none of these changes are addressing my primary problem of display in IE11 (& versions?). I have found that Chrome/Firefox does recognise <br> as an end of line marker whereas IE does not. In the CSS both "content" & "story" show text-align: justify; text-justify: newspaper; So C/F stops justifying the last wrapped lines at <br> while IE carries on the justfication to end of the line in that block of text or until a </p> is encountered. For reasons of element spacing forcing a paragraph is NOT wanted.

So I'm going through both sites feeding in non-breaking spaces (or paragraph ends when I can get away with that) until the pages look right in IE. As you can imagine that process may take me to the end of the year or longer to implement. Surely there is a CSS method of arriving at the desired behaviour from Internet Explorer without vitiating the accurate rendering in Firefox & Chrome.

I will take to heart your comments about external calls and other console warnings & errors in time - but the need right now is to deal with this character spacing issue. The sidebar anomolies in my choir site (development page) can wait since this sidebar element IS being handled correctly by all three browsers in http://www.conservancyonmayne.com

I would be grateful for further assistance - thank you very much!

Why even use the strong tag? Why not use another element like span and then just change it in CSS?

Just to be clear, the self-closing version of the <br> tag is "<br />". If you see IE failing to recognize a <br> tag, it's because it was malformed. So don't go through your site trying to remove <br> tags. Just fix any that are broken.

I regret I mis-typed when it came to describing (in the message above) the break that I'm going to remove for consistency - however IE isn't recognising <br> or <br /> whereas Firefox & Chrome do. The <strong> tag works fine in all three after all - I was confused by the "justify" problem.

In the Conservancy site the slide caption panels at the head of the major pages is where I first noticed the problem in IE of spreading out the characters to the full width of the panel rather than seeing the break tag as the end of the line. Unfortunately (never checked IE since I never use it) this occurs in dozens of examples over many pages on two sites. I've only checked a couple & am horrified by the possible scope of the work if it is to fixed by detail changes to the HTML. Is the problem related to the way in which Microsoft recognises the CSS qualifier (right word?) of "newspaper" in the "justify" statement? If so, how to accommodate IE's peculiarities?

Right now that is the item for which I need your expert assistance. I look forward to continuing as a sponsor....

Thank you all for the various tips that have among other things introduced me to Firefox Developer Tools - very useful. I see today that Edge has similar. However none of the suggestions were problem solvers. For the record it would seem that IE treats justify: newspaper differently from Firefox & Chrome. I have found that justify: auto works for all three and my less than paragraph lines terminated in a <br> no longer stretch out to the full width of the para in IE. So for that part of the question I'm marking this one solved. Nonetheless I have another IE "idiocy" to ask about in another post. Thanks for your time rtrethewey, pixelsoul and diafol

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.