Commit 25e42ade authored by Chris Rebert's avatar Chris Rebert
Browse files

Add touch-action:manipulation on interactive elements to avoid 300ms click delay

Fixes #18044

[skip sauce]
[skip validator]
parent 6d591edc
Showing with 22 additions and 1 deletion
+22 -1
......@@ -8,7 +8,6 @@
text-align: center;
white-space: nowrap;
vertical-align: middle;
touch-action: manipulation;
cursor: pointer;
user-select: none;
border: $border-width solid transparent;
......
......@@ -206,6 +206,28 @@ img {
cursor: pointer;
}
// Avoid 300ms click delay on touch devices that support the `touch-action` CSS property.
//
// In particular, unlike most other browsers, IE11+Edge on Windows 10 on touch devices and IE Mobile 10-11
// DON'T remove the click delay when `<meta name="viewport" content="width=device-width">` is present.
// However, they DO support removing the click delay via `touch-action: manipulation`.
// See:
// * http://caniuse.com/#feat=css-touch-action
// * http://patrickhlauke.github.io/touch/tests/results/#suppressing-300ms-delay
a,
area,
button,
[role="button"],
input,
label,
select,
summary,
textarea {
touch-action: manipulation;
}
//
// Tables
//
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment