I'm able to resize Text Field in Chrome & other browsers. However, I'm not able to make the same work in IE9, even after installing the Chrome frame for IE. I use for Ex:
style="resize:horizontal;"
Ex:
Can someone suggest me how to make it work in IE browsers?
Thanks.
*EDIT*
Ok, So after a lot of tweaking around, I finally made it to work for IE9 !! Yay :)
First things first : You need to install the Chrome Frame on IE9.
Then you add some tags for it to render on IE.
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
Here's the complete code :
<!DOCTYPE >
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- <meta http-equiv="X-UA-Compatible" content="chrome=IE9">
<!-- X-UA-Compatible: chrome=1-->
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<head>
<title>Text Feilds</title>
<script src="Scripts/jquery-1.7.2.js" type="text/javascript"></script>
</head>
<body>
<input type="text" id="txt1" style= "resize: horizontal"; />
<input type="text" id="txt2" style= "resize: both"; />
</body>
</html>
You can’t, in any simple way. According to http://caniuse.com/#feat=css-resize there is no support in IE 9, and IE 10 status is unknown.
If you have a look at http://www.w3schools.com/cssref/css3_pr_resize.asp you will see that this feature is not supported in IE at all.
If you want to support this feature in all browsers you will have to create your own resize function in javascript (our use any framework if there is one).
That's HTML5 markup and older versions of IE do not support HTML5 or HTML5 ready. IE 9 only supports it in parts
Related
To prevent some browsers to translate certain term on a HTML page, I use the class="notranslate" class name in a wrapping tag.
It works fine for Google Chrome with its built-in Google Translate plugin.
But it doesn't work with Microsoft Edge.
According to their documentation, it should.
I also tried the translate="no" property on the tag, without any success.
Any idea how to solve this?
If not, I would like to prevent auto-generated translations on Edge, but not on the other browsers.
You can try to add this line inside <head></head> to disable automatic translation in browser:
<meta name="google" content="notranslate" />
I've tested and it can work well in Edge and Chrome.
Edit:
If you only want to restrict automatic translation in Edge only, you can add the <meta> tag dynamically. You can first check if the browser is Edge, if yes then add the tag. You can refer to the following JavaScript code:
<script>
if (window.navigator.userAgent.indexOf('Edg') > -1) { //detect if Edge browser
var meta = document.createElement('meta');
meta.name = 'google';
meta.setAttribute('content', 'notranslate');
document.getElementsByTagName('head')[0].appendChild(meta);
}
</script>
The google tag for not translating the page has been updated to
<meta name="googlebot" content="notranslate">
For more info check this link: https://developers.google.com/search/docs/crawling-indexing/special-tags
This worked for me in Safari, Edge, and Chrome:
<html class='notranslate' translate='no'>
<head>
<meta name="google" content="notranslate" />
<meta name="robots" content="notranslate">
...
</head>
<body translate="no" class="notranslate">
...
</body>
</html>
I have written a simple HTML file. In that in have included input <date> element which will not be supported by IE, Safari.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Date Polyfill</title>
</head>
<body>
Date Field :
<input type="date" name="polyfill-date" id="polyfill-date">
</body>
</html>
I wanted to make it work in Safari, So I have included date-input-polyfill by using "npm install --save date-input-polyfill" dependency in my project.
after that, I included this script tag in my HTML file.
<script src="node_modules/date-input-polyfill/date-input-polyfill.dist.js"></script>
then the date filed worked in IE but not in Safari.
The main aim is not to depend on any library like datepicker or anything. I just wanted to create a polyfill / fallback.
I am working in window 10 with Safari 5.1.7.
Kindly help me to resolve this.
Ive been making a website for a technology fair project, and it has come to a stage where I want to make it more universal. However when I try to add another language (Chines Mandarin as an example) It just converts the text to some wired english characters.
Here is my example Website
<html lang="cmn">
<head>
<title></title>
</head>
<body>
<!-- This is meant to say in Mandarin "This is some text" -->
這是一些文本
</body>
</html>
But when the page loads, this is what I get
這是一些文本
Im pretty sure that its not some settings in my browser Firefox, because I've or so tried it in Google Chrome
Any suggestions?
Add the following meta definition inside your head tag:
<meta charset="utf-8" />
Did you tried:
<meta charset="utf-8" />
?
I am using the latest version of Eclipse Luna (for Java EE developers), and when I insert an <input type='text' placeholder='test123', eclipse says "Undefined attribute name (placeholder).".
Why is it like that? Have I done something wrong? Is there a way of fixing this?
Add the <!DOCTYPE html> indicating that its HTML5, placeholder is a new element in HTML5 and doesn't exists on HTML4 or early versions
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<form>
<input placeholder="aspdkpoas"/>
</form>
</body>
</html>
Eclipse checks for html tags and attributes against the doctype. Make sure that you have given doctype on top. It will fix the problem.
Also, Eclipse uses IE internally. You can configure it to firefox/chrome for better tags and attribute comparison.
Refer to this How can I change eclipse's Internal Browser from IE to Firefox on Windows XP? for changing your browser.
A little Question from my side. I'm working on a new internal Webpage at my Company which should be optimizied for Internet Explorer 9. So far I have to following HTML Code:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Intranet</title>
</head>
<body>
<div id="wrapper">
<div id="navigation">
nav
</div>
<div id="content">
content
</div>
<div id="content_shadow"></div>
<div id="right">
<img src="/gfx/logo.png" alt="alt" title="title" class="logo" />
</div>
<br class="clear" />
</div>
</body>
</html>
For any reason Internet Explorer shows me the symbol that there are compatibility issues in my side, when I click on it there's not really a change at all but I'm just wondering why the compatibility icon apears? Is there something wrong at my code?
Thanks for your help
Intranet sites by default are loaded in compatibility mode by default.
You need to use a X-UA-Compatible meta tag to achieve what you want in intranet sites without change IE settings.
<meta http-equiv="X-UA-Compatible" content="IE=9" />
Since you making it compatible with IE9 looks like you are using many Web Standards. So I reccomend you say do IE to use the newer engine available instead of just fix it to IE9:
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
In this case if you are using IE10 or IE11 (currently in preview) it will use their best engine instead of always IE9.
More information about Specifying legacy document modes.
Probably because you have not explicitly defined the page compatibility.
Go through this link
http://msdn.microsoft.com/en-us/library/cc288325(v=vs.85).aspx
It will explain you how to explicitly define it.
Also read this answer. It explains it very well
Why does IE9 switch to compatibility mode on my website?
For intranetsites you need the following meta tag to display the site correctly:
<meta http-equiv="X-UA-Compatible" content="IE=9" />
or if you don't want to force IEs > 9 degrade to IE9 view, then use:
<meta http-equiv="X-UA-Compatible" content="IE=edge" />