I'm working on webpage that was built to run on IE7, and now i'm in the process of upgrading the page to run in IE11 Edge mode by default.
What i've did in the page is that i added
<!DOCTYPE html>
I also added this
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Test Image Request</title>
<style type="text/css">
.auto-expand{overflow-y:visible}
</style>
</head>
Now whenever i open the page, the Emulation Panel in IE11 Developer mode says its rendering in IE7!
What did i miss?
Solved! there was <script> before <head>, moved it after <head> and now eveything works fine.
Related
I currently don't have a favicon for my Vue app and want to remove the default one. I commented out the relevant line in the public/index.html file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<!-- <link rel="icon" href="<%= BASE_URL %>favicon.ico" /> -->
<title>My Vue app</title>
</head>
<!-- ... body code ... -->
</html>
and run npm run serve. The page still renders the initial favicon. How can I remove it?
Generally when this happens it's one of two things
Most browsers will check for a file called favicon.ico in the root folder and use it even if you don't include it in your head tag.
If the file has been deleted but you had previously opened the website then it's likely just cached in your browser. You can easily check by opening the site in incognito/private browsing mode. Clearing your browser cache for the website will remove it.
Actually, after trying to change my favicon and failed, I added this line after inspecting vuejs <link rel="icon" type="image/png" sizes="32x32" href="/img/favicon.png">, whereby, this time, favicon.png was targeting my own image.
I am using Safari Version 12.0.2 (13606.3.4.1.4) and I have very simple page like this,
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="main.css" />
<script src="https://d161vkckch5xxj.cloudfront.net/LS/ASSETS/PROD/US/bundle.js"></script>
</head>
<body>
Hello There
</body>
</html>
This shows when I reload the page the asset is loading from the cache which is expected.
Changing the Script tag to a URL which redirects to this asset because there are different variations of this script and based on the context right script will be loaded. So when I change script tag from
<script src="https://d161vkckch5xxj.cloudfront.net/LS/ASSETS/PROD/US/bundle.js"></script>
To this
<script src="https://pvpsx9qpxa.execute-api.us-west-1.amazonaws.com/PROD/getAsset?marketplace=US&assetName=bundle.js"></script>
Which points to the same asset, now when I reload the page every time, the whole asset is getting loaded and it's not hitting the cache at all, Mobile Safari has the exact same issue.
In chrome and FF it works the right way and shows the redirect as well, what to do for Safari as it's a big asset and can't be freshly loaded every time.
Chrome results,
I have a source code use manifest. When i run code in chorme it work. But when i run in ie 10 AppCache Fatal Error.
Code html:
<html manifest="demo.manifest">
<head>
<meta charset="utf-8" />
<meta http-equiv="EXPIRES" content="0" />
<meta http-equiv="PRAGMA" content="NO-CACHE" />
</head>
<body>
<script src="js/jquery.min.js"></script>
<p id="timePara"><button onclick="getDateTime()">Get Date and Time</button></p>
<p><img src="imgs/img_logo.gif" width="336" height="69"></p>
<p>Try opening this page, then go offline, and reload the page. The script and the image should still work.</p>
</body>
</html>
And code manifest file:
CACHE MANIFEST
js/demo_time.js
imgs/img_logo.gif
Some body help me. Thank you for support.
HTML5 Video tag fallback is not working for me. Embed tag without Video tag works fine.
Below code doesn't work.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<title>Video Demo</title>
</head>
<body>
<video width="549" height="309" controls autoplay>
<source src="small.3gp" type="video/3gpp">
<div>
No Movie
<embed width="549" height="309" autoplay="true" type="video/quicktime" src="small.3gp">
</div>
</video>
</body>
</html>
Below code works.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<title>Video Demo</title>
</head>
<body>
<embed width="549" height="309" autoplay="true" type="video/quicktime" src="small.3gp">
</body>
</html>
I need to create a video player which can run any kind of video file and fallback to quick time if its not supported by native. Mp4 format works fine as its supported in native browser (Chrome , IE and FF also as decoder is already there).
I am testing fallback for other than Mp4. like 3gp in this case.
I have seen code examples of Video for everybody, videojs, diveintohtml5/video, but not able to execute the the above code.
Any help would be appreciated.
Why does the following media query work fine in FF (22.0) and Chrome (28.0.1500.71), but Safari (6.0.5) ignores it?
In case it's relevant, I'm using Mac OS X (10.7.5) macbook pro 13"
Thank you for your help!
Also, does anyone know if it works in IE?
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>title</title>
<style type="text/css">
body {background-color:#efefef;}
h1 {color:black;}
#media only screen and (max-width:37.5em) {
body {background-color:#000000;}
h1 {color:white;}
}
</style>
</head>
<body>
<h1>Hi.</h1>
</body>
</html>
I found out why it wasn't working:
To test the media query, I was zooming in on the page, rather than resizing the browser window, and in Safari, unlike FF and Chrome, the media query doesn't kick in until you've refreshed the browser.