Image in div is not show in Chrome but shows in IE - html

I have the following simple HTML code, the code runs correctly using the run snippet and in Internet Explorer. However, if I copy this code, save it to text.html and try to run it in Chrome the image doesn't appear.
What is the nature of this problem? And, how do I fix it?
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<H1>This is Scott!</H1>
<div>
<img src='http://mgecombanners.com/wp-content/uploads/2017/12/5KAWFvr_JanTV18_Red_728x90.jpg' border='0' />
</div>
</body>
</html>

If you have AdBlocker enabled it's blocking the image probably as it contains word "banner". Image displays as intended on incognito window.

On an https website contents from an http website will not be loaded in all browsers, which is the case here (in the snippet on SO at least). (might also depend on personal browser settings)

Related

download attribute does not work in <a> tag

According to the documentation and many posts, the tag
must save a file, however for me it just opens an image in a browser: chrome, firefox, safari.
download. Prompts the user to save the linked URL instead of navigating to it.
What should I do to force downloading to a drive, without JS?
Minimum working example:
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
download
</body>
</html>
This link might be helpful . From Chrome 65+ download tag is discontinued. It is accepted only when it is from the same origin.
Problem here is, It uses JS. So, It is not completely independent of JS.

Firefox and MS Edge download content in hidden element (but should not)

The following code snippets highlights what I consider to be a bug (or is it a feature?) in MS Edge and Firefox: a PDF file is downloaded when displaying the page, even though it is hidden.
Chrome and (not surprisingly) MS Edge Chromium, do not download until the element is visible, which I what I would expect.
<html>
<head>
<title>Test Embedded PDF</title>
<body>
<!-- ... explanation text removed ... -->
<div style="display:none">
<object id="pdf-view" data="https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf" type="application/pdf" style="width:100vw;height:100vh;"></object>
</div>
</body>
</html>
Screenshot: On Chrome - PDF IS NOT downloaded
Screenshot: On Firefox - PDF IS downloaded, despite the fact that it is hidden
Has anyone encountered this, and is there a work-around?
Thank you

Prevent hyperlink auto-creation

I notice the Chrome browser automatically creates hyperlinks for web address references that are not anchor tags. I have a page which will list web addresses (e.g.: www.mycompany.com). But in this instance having them converted to links makes things more confusing.
Is there an html tag I can use to prevent this?
I just create a file that I called test.html with the following content:
<html>
<head>
</head>
<body>
<p>
www.microsoft.com
</p>
</body>
</html>
I opened it in Google Chrome.
The text is not hyper-linked.
There might be something else going on you are not describing. Can you give an html that can reproduce your problem?
It can be settings related or you might have some javascript on your page that "linkifying" whatever looks like a url. Or a browser plugin.

Save Complete Website - Background Images not showing

When I click Save As in Firefox, Chrome, or IE, then choose "Webpage, Complete" from the save as menu, it does not appear to be saving the background images defined in my CSS. Am I doing something wrong? Here is a sample problem:
test.html
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<link href="test.css" rel="stylesheet" media="screen" type="text/css" />
</head>
<body>
<div id="test"></div>
</body>
</html>
test.css
#test {
width: 400px;
height: 400px;
background: url(img/bg.jpg)
}
By default browsers won't download images set in css.
You can do this in Firefox:
Right click -> View page info -> select media tab -> highlight all the files -> save as...
Recently I've been testing saving the complete HTML web page with background images across various browsers and only Opera 12 was able to save the complete website as seen online. Just open the desired website, click Ctrl+S and choose to save a complete website.
The only solution who worked for me is to save the page as MHT with the plugin unMHT (for firefox) :
https://addons.mozilla.org/fr/firefox/addon/unmht/
Even webfonts are dowloaded !!
MHT can be opened in IE & Chrome (and firefox but only with this extention).
I know this solution is not perfect but this is the better I found...

Facebook Like Button not working in IE

I am having trouble getting consistent behaviour from my Facebook Like button. I have created this example which I believe to be the simplest possible implementation...
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<title>Untitled Page</title>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1" type="text/javascript"></script>
</head>
<body>
<fb:like href="http://www.stackoverflow.com" layout="button_count" show_faces="false" width="450" font=""></fb:like>
</body>
</html>
I have saved this as an HTML file which I am serving from a webserver running on my machine (localhost - I assume this won't be a problem as the page I'm 'liking' in this example is public-facing).
If I try this in Google Chrome, it appears to work without a problem.
When I try it in IE9, the like button renders, but when I click it, a new IE window opens which is mostly blank apart from a blue Facebook header. The URL of this page is: http://www.facebook.com/connect/connect_to_external_page_widget_loggedin.php?social_plugin=like&external_page_url=http%3A%2F%2Fwww.stackoverflow.com%2F
This is really confusing me as the example is about as simple as it gets! Any help would be really appreciated!
EDIT: A little more information. If I go to Facebook in IE9 and log-out, then try my like button again, a new window still opens but this time I can login. After logging in, though, I still get taken to the same blank page.
In desperation, I tried accessing my local page from http://127.0.0.1 instead of http://localhost
This appears to have solved (or at least worked around) the problem.
I would love to hear from anyone who can explain what this is all about!!