The Polymer 0.8 announcement page states that there will be "Support for parser-challenged elements like <table>, <select>, etc.".
Is this referring to the issues IE has with nesting <table> with <template>?
Related
why do caniuse considers the html tag menu "well-supported in all browsers effectively" (http://caniuse.com/#search=HTML4%20elements%20(well-supported%20subset)?
According Mozilla web site, that support from the web browser is rather poor(https://developer.mozilla.org/en-US/docs/Web/HTML/Element/menu#Browser_compatibility).
Has HTML menu tag only sense if (if) it contains nested menuitem tag (which has very little support even according caniuse: http://caniuse.com/#feat=menu)?
Thanks.
<p>The following html tag <i>menu</i> actually works in all web browser: is this (without nested <i>menuitem</i> tag) a "proper" use of the tag?</p>
<menu>
<li>1</li>
<li>2</li>
<li><button>button</button></li>
</menu>
I got an answer on the caniuse support page (thanks
#mplungjan for the suggestion): https://github.com/Fyrd/caniuse/issues/3121#issuecomment-274061971
The first link of my original question ("menu element is well-supported") refers to HTML4.
Paper-drawer-toggle is used when the layout is small (minimized). Please help me use the same option when the layout is wide.
I am using Google Polymer 1.0, HTML and CSS.
You want to use the force-narrow attribute.
<paper-drawer-panel id="riotnav-drawer" force-narrow="true">
</paper-drawer-panel>
I've created a page using Bootstrap with a standard layout of next and previous page links. On the first page, I disable the 'previous page' link as follows:
<div role="navigation">
<ul class="pager">
<li class="previous disabled" aria-disabled="true">
Previous page
</li>
<li class="next">
Next page
</li>
</ul>
</div>
It seems like screen readers (JAWS, NVDA and VoiceOver) aren't seeing the aria-disabled="true" flag, even though the W3C WAI-ARIA spec states:
The state of being disabled applies to the current element and all
focusable descendant elements of the element on which the
aria-disabled attribute is applied.
If I add aria-disabled="true" to the link:
...
<li class="previous disabled" aria-disabled="true">
Previous page
</li>
...
then it works as I'd hoped, with the screen reader describing the link as 'disabled'.
Am I misunderstanding the WAI-ARIA spec, or is this a 'feature' of screen reader implementation? In his comment on 'How do i tell a screen reader that a link is disabled', Bryan Garaventa mentions:
... the use of aria-disabled works best for elements that have a
defined role, such as role=button.
Can aria-disabled only be applied to focusable elements?
With JAWS 16, both IE and Chrome have the problem you describe, but FF 38 works correctly (not sure about previous versions of FF). When I tab to the link where the <li> has aria-disabled="true" and there's not an aria-disabled="true" on the <a>, FF 38 and JAWS 16 says "previous page unavailable link".
It doesn't actually prevent me from activating that link, because that's not what aria-disabled is for, but JAWS seems to know the child element is disabled because the parent is disabled.
It also works in VoiceOver on iOS 8.3 on an ipad2. VO says "previous page dimmed link"
This might be a case where you have to decide whether to keep the properly formatted html and let the user agent fix the bug, or if you should try to code around the problem, which in your case was putting the aria-disabled on the link itself.
As per WCAG, aria-disabled is not allowed on 'li'
element. Apply it on 'a' tag directly.
TL;DR
Which elements can be nested inside the <dialog> element?
When I look at examples like this, this and this they all place elements like <h3>, <p> and <button> as child nodes to the <dialog> element.
However, the Visual Studio (2013) intellisense list only the following elements:
content
dd
dt
shadow
template
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<dialog role="dialog">
<content></content>
<dd></dd>
<dt></dt>
<shadow></shadow>
<template></template>
</dialog>
</body>
</html>
Now, if I add a <div> element to the <dialog> element
<dialog role="dialog">
<div></div>
</dialog>
Visual Studio will complaint that:
Element 'div' cannot be nested inside element 'dialog'.
The div element has no special meaning at all. It represents its children. It can be used with the class, lang, and title attributes to mark up semantics common to a group of consecutive elements.
I also looked at the W3 docs but to no avail.
So I ask again: Which elements can be nested inside the <dialog> element?
The dialog element is not part of any approved specification (recommendation). What comes closest to a standard for it is the HTML 5.1 draft, which you cite and which says that any flow content is allowed. This means pretty much anything you can put inside a document body, surely including div. The WHATWG “HTML Living Standard” description of dialog has the same content model.
Visual Studio apparently has its own idea of dialog.
In any case, browser support (or lack thereof) currently makes dialog rather useless except in experimentation and in limited contexts (like application designed to run on a specific browser).
Update for 2022: <dialog> indeed made it in our browsers with production-ready support: https://caniuse.com/?search=dialog and as per the specification, any flow content can be used.
Visual Studio doesn't like on-page anchor tags:
Validation (XHTML 1.0 Transitional):
Attribute 'name' is considered
outdated. A newer construct is
recommended.
I'm using name attributes in this way…
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemalocation="http://www.w3.org/MarkUp/SCHEMA/xhtml11.xsd" xml:lang="en">
...
<body>
...
<p>On this page…</p>
<ul>
<li>Section One</li>
...
</ul>
...
<h2><a name="one">Section One</a></h2>
...
</body>
</html>
Is there really a more-modern way of doing this? Or is Visual Studio full of crap?
You should use the id attribute instead. Works the same way, and you don't need an artifical <a name=...>, but simply
<h2 id="one">Section One</h2>
name attributes are deprecated in XHTML 1.0 - you can use an id attribute in the same way though, see Fragment Identifiers in the HTML Compatibility Guidelines of the XHTML spec.
So you can simply use
<h2><a id="one">Section One</a></h2>
But note that the 1.0 spec recommends playing it safe with something like this:
<h2><a name="one" id="one">Section One</a></h2>
However, your fragment uses XHTML 1.1, where the name attribute has been entirely removed from a and map elements - so you can only use an id.
I believe the modern approach is to use the id attribute, which would be evaluated as an anchor. For example, if you changed
<h2><a name="one">Section One</a></h2>
to
<h2><a id="one">Section One</a></h2>
You would still address it as page.html#one.
You can also link on a section header :
Table of Contents
<P>
Introduction<BR>
Some background<BR>
On a more personal note<BR>
...the rest of the table of contents...
...the document body...
<H2 id="section1">Introduction</H2>
...section 1...
<H2 id="section2">Some background</H2>
...section 2...
<H3 id="section2.1">On a more personal note</H3>
...section 2.1...
[...]
</P>
Source: http://www.w3.org/TR/REC-html40/struct/links.html
I believe the proper way to do it is <a id="one">
Yes it is outdated. You should replace with the "id" attribute.
Quoting w3schools page:
"The id Attribute Replaces The name Attribute
HTML 4.01 defines a name attribute for the elements a, applet, frame, iframe, img, and map. In XHTML the name attribute is deprecated. Use id instead."
http://www.w3schools.com/Xhtml/xhtml_syntax.asp
name= attributes are for labeling elements in a form, and can only be used on <form> elements (input, textarea, select etc). For everything else, ID= is used. Exactly why the W3C folks thought two different ways of naming an element (with different sets of allowable characters) were needed is not readily known.
But here http://www.w3.org/TR/html4/struct/links.html#h-12.2.3 I read this: "Some older user agents don't support anchors created with the id attribute." So?
Until <a name="..."></a> is no longer supported by the (X)HTML standard you are using--and not just deprecated--it may be safest to use both name and id on anchors linking to a part of the same page. From the W3C's XHTML 1 spec:
In XML, URI-references RFC2396 that end with fragment
identifiers of the form "#foo" do not refer to elements with an attribute name="foo"; rather,
they refer to elements with an attribute defined to be of type ID, e.g., the id attribute in HTML
4. Many existing HTML clients don't support the use of ID-type attributes in this way, so identical
values may be supplied for both of these attributes to ensure maximum forward and backward
compatibility (e.g., <a id="foo" name="foo">...</a>).