I have a very weird problem, I have a markup, which is being treated by chrome (tested on mac, windows, and ubuntu-chromium) in weird manner..
I've created a simple version of the situation..
<h3>First Part<span>Content in Span</span></h3>
Chrome is adding extra quotes to First Part, while its not present in any other browser (tested on Firefox, and ie.)
Simple demo I've created on JsFiddle here..
In Chrome:
In Firefox:
This is just the way that chrome presents the text node content in the element inspector. You can see white-space better this way. The quotes are purely virtual.
The quotes do not exist in your HTML document. They just appear in Chrome, to show that you are viewing the text content of an element.
You shouldn't worry about them at all. If you check the Source code (right click, View Page Source), you will see that they are not there.
Related
I am creating a website and need to have a specific link open with the Edge browser. (Company designed software to only work with Edge as its easier for SSO, not compatible with Firefox or Chrome)
I created an anchor tag with the microsoft-edge parameter and the link will open up fine when using other browsers like Firefox (a popup will force the user to select edge) but when actually using edge the link does not do anything. Upon inspecting element the anchor tag is not even rendered in the DOM.
The following is an example of how i used the anchor.
<a href="microsoft-edge:https://google.com> Click Here </a>
Any advice?
Well, to start, your anchor, <a href="microsoft-edge:https://google.com> is missing a " to close the value of the href attribute. The working code appears in the following snippet:
Click Here
However, this only explains the final issue you mention :
...the anchor tag is not even rendered in the DOM
(I assume you got tangled up in your troubleshooting steps)
The actual problem is that Microsoft Edge doesn't support the microsoft-edge: protocol. I haven't found a published source for this, but I have found a reference to this issue (and a javascript-based workaround) in the SO answer: https://stackoverflow.com/a/53765993/2540235
This page is being rendered incorrectly by IE 9 (and probably older versions too). The right menu is floating to the bottom of the page. Firefox, Chrome and Safari are rendering it correctly. Other pages in the blog are also being rendered fine by all browsers. I already tried to fire IE 9 Developer Tools (F12) and reduce the width of some divs (such as #main and .columns-inner)... no lucky with this approach, even with extra space the right menu is still rendered at the bottom. So I figure that the problem is in the Blogger auto-generated tags / css for the page content (which I am able to modify). Any CSS gurus out there can point what is wrong?
Cheers,
You have this line in your <head>, which is causing IE9 to render the page in IE7 mode:
<META content=IE=EmulateIE7 http-equiv=X-UA-Compatible>
If you remove this, it renders fine in IE8 and IE9. It still renders poorly in IE7, though.
Edit:
In response to your comment, I am able to replicate the issue with the background no longer being opaque. After some investigation, there is a particular script file being loaded:
http://www.blogger.com/static/v1/jsbin/938506610-ieretrofit.js
If you remove the <meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/> on line 4 of the source, and you remove the ieretrofit.js file from line 1471 of the source, the page should render correctly in IE9.
Since the ieretrofit.js file appears to be generated by Google, you might want to ask them about it. If you would like to disable it JUST for IE9, and allow it to continue for IE8 and below, you should take a closer look at line 1471 of the source. Here is a snippet (it's quite long, this starts around character #2275):
'\74!--[if IE]\76\74script
The !--[if IE] there is part of an IE conditional comment. You can change that snippet like so, and it will still target IE8 and below, without affecting IE9:
'\74!--[if lte IE 8]\76\74script
Let me know if you have any further issues!
The page has 104 validation errors — I’d start by fixing those if I were you.
Almost certainly it is because the page is invalid. Also, I really would think about starting again with this page as it is overly complex markup.
Guys. Figured it out (with great help from andyb and Paul D.)
The validator pointed to some unpaired </div> tags that I removed. Now it is working flawless.
i am making a menu for my school assignment and it needs to work in both IE and firefox.
I am done the menu and it works perfectly in firefox, but i am having trouble getting it to display properly in IE
A part can be found over here: http://tutudragon3.info/ie-trying.php
When i click the home image in firefox, a dropdown sort of thing pops-up with 2 images with text "d" and "d". In firefox, there is no space between those dropdown images, but when i try it in IE, I see a small blank space between them.
how could i fix this (delete that space) please. I tried many different things but it didn't work.
Using IE8 by the way.
Before worrying about any specific bugs:
Use a Doctype that triggers standards mode, as quirks mode inconsistencies are a nightmare to deal with. If in doubt, use HTML 4.01 Strict: http://www.w3.org/QA/2002/04/valid-dtd-list.html
Deal with machine detectable errors
If you have done the things David mentions, and still see some differences, you might want to take a look at ie7.js, it is a JavaScript library to make Microsoft Internet Explorer behave like a standards-compliant browser.
I don't find any problem in IE7. But if you are having the problem, try giving display:block; to the <A> and <IMG> tags. The problem should vanish.
This is a simplified Chinese page, link:
http://www.vanillafactory.com/clients/womensclinic/www/sc/resources/weekbyweek.html
You'll discover that the page is blank when it renders in IE7 (FF, Chrome are fine).
However, if you download this page on your desktop and then remove the title tag, then the page works fine again.
What's the problem of this page? The title tag or elsewhere?
It works fine for me with IE 7.
Only thing is that the title tag shows up as a line of boxes.
This error is probably something to do with the security settings in your browser. Since it works from a local disk but not from the Internet.
It works fine for me in IE7. The blocks in the title tag go away when you use the ENG tab at the top of the page. I believe that the problem lies with the Chinese language not being displayed properly in the title tag.
It's the encoding problem of different browser.
changing the encoding to UTF8 solves the problem.
The problem is on my blog - blog.dynback.com.
Right panel goes down in Chrome, and stayed normal in all other browsers including Safari 4. And without Firebug its hard to find where is the problem.
You have errors in your markup, fix those first, at least the missing end-tags.
Validate here: http://validator.w3.org/check?uri=http%3A%2F%2Fblog.dynback.com
I think it has do to with the JavaScript. I've noticed the issue appears after code snippets are highlighted. Chrome uses a different JavaScript engine than Safari. Maybe that's the problem.
Try to shrink the width of #main_content