HTML attribute accesskey not working as it should - xhtml

So, I'm testing all different HTML tags and attributes, freshing things up a bit, and for some reason, accesskey does not appear to be working.
The accesskey attribute is used to assign a key to an element. Depending on your OS, pressing Alt+that key (Windows) or Cmd+that key (Mac) will give focus to that element.
Here's a little something:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us">
<head>
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
a:focus{
color:red
}
</style>
</head>
<body>
<a accesskey="x" target="new" href="#">Hello</a>
</body>
</html>
So I'm working on a Windows machine. Thusly, I expect the anchor to go red when I press Alt+x. Yet it is not.
Is there something wrong with the code, or am I expecting the wrong thing to happen?
On Firefox, nothing happens. Google chrome opens a new tab (as it should, the target attribute say "new", which means open in new tab/window) and IE jumps to the anchor but does nothing further.

According to Mozilla's documentation on accesskey Firefox's accesskey for Windows and Linux modifier is Shift+Alt.

Alt + [the accesskey]
Internet Explorer for Windows
Chrome for Windows (not that Shift is required in some circumstances
Safari for Windows
Shift + Alt + [the accesskey]
Firefox for Windows
Ctrl + Option + [the accesskey]
Safari for Mac
Chrome for Mac
Firefox for Mac

If you're determined to assign accesskeys (and there may be some good reasons to use this terribly implemented feature), you should take a look at WebAIM's page on accesskeys which outlines some of the obstacles you'll face.
One thing, on the Mac most browsers that support accesskeys --except Opera-- use Control not Command. Opera apparently uses Shift-Esc ... who knew?

You have to press Enter to follow the link when it has the focus in IE.

In firefox you need to press shift+alt. In IE hitting the modifyer key only sets focus to that element, this is by design. These are the only two browsers accessible with my screen reader so can't give you more info on others.

If you are using firefox on mac then, you should press ctrl + 'your access key'.

Related

IE11 will not load external css from intranet

IE11 will NOT load external css from the intranet - at all. Internal css works fine. In-line css works fine. External CSS works fine on the Internet. Everything works fine in other browsers - everywhere!
When I open C:\Users\hennesse\Desktop\test.html (below) by either right-clicking and openWith->IE - or- typing into the IE location bar, I get two alerts: "internal javascript", and "external javascript" - then:
the first line is NOT red
the second line is blue
the third line is green
However, if I upload this to my web server, and open it with IE, the first line IS red. With Firefox and Chrome, the first line is ALWAYS red, intranet or internet.
For some reason, IE11 will not load the external CSS file on "My Computer".
Changing security settings in Internet Options->Security->Allow Active Content to run in My Computer (and rebooting) results in a prompt (or not) about Allow Active Content? But the results are the same.
This is driving me insane! -Dave
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="test.css">
<!--
external file test.css contains:
body { color: #ff0000 }
-->
<style type="text/css">
.blue {
color: blue;
}
</style>
<script type="text/javascript">
alert("internal javascript");
</script>
<script type="text/javascript" src="test.js">
// external file test.js contains
// alert("external javascript");
</script>
</head>
<body>
This should be red, but it isn't
<p class="blue">
This is blue
</p>
<p style="color:green">
This is green
</p>
</body>
</html>
In the F12 console, I found: SEC7113 "CSS was ignored due to mime type mismatch". Discussion here: 1 [MSDN]. It seems that IE9 and above "sniff" the HTTP headers for the correct MIME type, and ignore JS and CSS that have the wrong header. When it fetches files from the local filesystem, it should disable this sniffing, since there aren't any real HTTP headers.
But my particular computer is sniffing and ignoring anyway. I've searched and searched, but the mighty Internet has only yielded one other person who has this problem. She solved it by reloading the operating system. I'm not gonna do that!
I very seldom use IE for anything except a final compatibility check after I've loaded stuff to a server. Except for one personal "extension" to a Windows app that invokes IE on the user's computer. Since I'm the only using it, I just hit F12, and select IE8 mode (this shows it's the IE9-up MIME sniffing). It works fine, and since it only costs me a couple mouse clicks, it sure beats reloading the OS.
Although I didn't really solve the problem, perhaps the "sniff and ignore" info can help someone else do so. OCHI - thanks for your help.
-Dave

Why is this CSS:before statement not working in IE 8, IE9?

Using a :before CSS to get an image/icon here (see round circle in image below), but in Internet explorer 8+ it is just not showing up.
This is the site:
http://www.websiteprofessioneel.nl
Image link below shows right element (it's the icon in the first post header) as circled on this screendump
http://tinypic.com/view.php?pic=xxd9f&s=5#.Ul_WajZRoWY
this is the CSS for that:
.welpen h2:before {
content: url("/wp-content/uploads/z-welpen-category-small.png") !important;
}
Anything missing perhaps? All other browsers work fine and as far as I know peudo CSS is totally supported in at least IE9, but it's not working in both IE8, 9 and up.
IE is Probably Using Quirks Mode
Internet Explorer can run in quirks or standards mode. The purpose of quirks mode was to make the new standards-compliant IEs (8+) able to read and process the code people had previously written for IE7-.
Likely Reason #1: invalid or absent DOCTYPE declaration
Try specifying this on the first line of your HTML document:
<!DOCTYPE html>
Make sure the <html> element is present. Even though HTML5 specification says it's not needed, older IEs (10 and older) tend to enter quirks mode when it's not specified.
Likely reason #2: site fails (X)HTML validation
If this is present, make sure the W3C validator throws no errors as these can also trigger Quirks Mode in IE. Yours has 15.
Actual reason was more unlikely: deliberately triggering Quirks Mode
After comments discussion, turns out I was right about the quirks mode, but wrong about the reason. Make sure you don't have any meta tags telling IE to run in quirks mode such as this:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
problem is because of something wrong in doctype, use <!DOCTYPE html> for html5 and to make it working on ie8 use
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
if you don't want html5 then use
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
this will fix the problem i think

Force Internet Explorer 9 into Quirks Mode

I have a web design class and our teacher wish's for us to force a browser into quirks mode.
Is their any CSS feature or html 5 feature that will do the job? Its for a discussion question but I need to make a simple webpage.
Don't provide a doctype, it will go into quirks mode on its own.
<html>
<head>
<title>I'm in Quirks Mode</title>
</head>
<body>
<p>Quirks mode supports the JavaScript functionality of
IE6, and the Quirks mode of IE7 and IE8.</p>
</body>
</html>
If you need something to cite:
If your webpage uses one or more features that require IE9 mode and you do not include a standards-compliant !DOCTYPE directive, Internet Explorer 9 displays, by default, your webpage in IE5 (Quirks) mode, which does not support features that require IE9 mode. source
Additionally you can force it into Quirks Mode via the developer tools as well; just press F12 and change the Document Mode. Note that this method is usually only used for quick testing, and affects your local copy only.
Adding any HTML comment block above your tag will throw IE9 into Quirks Mode!
Like this
<!-- -->
<!DOCTYPE html>
<html>
Source http://timjames.me/force-ie9-into-quirks-mode
try without doctype but it wont be a good idea
or try
<!-- -->
<!DOCTYPE html>

wordpress website display wrong in IE

I have wordpress website, and the homepage of this website display incorrect in IE.
I'm developer too, so I know I have to put doctype in the header to force IE display in standard mode. But when I use developer tool in IE, it's display the doctype stay inside body tag.
Here is my website: http://kidscare.edu.vn/
and the screenshot:
http://imageshack.us/f/546/kidcareiebug.png/
The weird thing is another page is display correct. I don't understand why this error appear.
this site is working perfect in all IE expect ie6 quirks mode, the prob is you are viewing this site in quirks mode,
For changing this mode alt+7 or press f12 than change the document mode to the standard one.
Please change this mode and this will work fine see my ss.
its how site will look in IE7+.
you can check these questions also :
How do I get IE9 to use standards compliant mode when developing on
localhost?
why am I triggering quirks mode in IE8?
You have two starting HEAD tags and one closing HEAD tag. There should be one starting and one closing HEAD tag on your page. Try removing one.
Oeps, I typed HEAD but meant HTML. There is a typo in the conditional statement at the end of the first line:
<!--[if !(IE 6) | !(IE 7) | !(IE 8) ]><!-->
<html dir="ltr" lang="vi-VI" xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:og="http://ogp.me/ns/fb#" >
<!--<![endif]-->

ie 8 show itself as ie7 [CSS if condtion]?

ie8 version on my computer , show itself as ie 7 when i use CSS IE CONDTION like
<!--[if IE 7]>
<script type="text/javascript">alert('hello iam ie 7 :P ');</script>
<![endif]-->
but when i try it on another computer with ie8 its work normally , its possible to have any
problem in my client website or this is ie problem ?
(IE 8.0.7600.16385 )
It may be problem with ur Internet Explorer Developer Tool so, use following to solve it,
press F12,
you can see the Browser Mode : IE8,
change it by clicking on it,
and select the appropriate menu,
Internet Explorer 7
Msie8 has an option to act as ie7 -- if you press F12 you will get a debug window, and in the upper right corner of that window you should see various options about which version to act as. You can switch to ie8 there.
can't tell for sure but I had an problem with ie8 some time ago that sounds pretty related to yours...
In my case I had to set the doctype of the html element in order to not run in compatibility mode where ie8 acts like it was ie7...
Just add something like that on the first line of your html and see if it works...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

Resources