[change] docs on MQs and a11y

README.md

@@ -163,31 +163,43 @@ The fundamental UI building block using flexbox for layout.
 
 ## Styling
 
-React Native for Web relies on styles being defined in JavaScript.
+React Native for Web relies on styles being defined in JavaScript. Styling
+components can be achieved with inline styles or the use of
+[StyleSheet](docs/apis/StyleSheet.md).
 
 The `View` component makes it easy to build common layouts with flexbox, such
 as stacked and nested boxes with margin and padding. See this [guide to
 flexbox][flexbox-guide-url].
 
-Styling components can be achieved with inline styles or the use of
+### Media Queries, pseudo-classes, and pseudo-elements
-[StyleSheet](docs/apis/StyleSheet.md).
+
+Pseudo-classes like `:hover` and `:focus` can be replaced with JavaScript
+events. Changing styles and the render tree in response to device adaptation
+should also be controlled in JavaScript, e.g., [stile's @resizeable and
+ResizeProvider](https://github.com/bloodyowl/stile),
+[media-query-fascade](https://github.com/tanem/media-query-facade), or
+[react-responsive](https://github.com/contra/react-responsive). This has the
+benefit of co-locating breakpoint-specific DOM and style changes.
+
+Pseudo-elements are not supported.
 
 ## Accessibility
 
 On the Web, assistive technologies derive useful information about the
-structure, purpose, and interactivity of apps from their HTML elements,
+structure, purpose, and interactivity of apps from their [HTML
-attributes, and [ARIA in HTML](https://w3c.github.io/aria-in-html/).
+elements][html-accessibility-url], attributes, and [ARIA in
+HTML][aria-in-html-url].
 
 The most common and best supported accessibility features of the Web are
 exposed as the props: `accessible`, `accessibilityLabel`,
 `accessibilityLiveRegion`, and `accessibilityRole`.
 
 React Native for Web does not provide a way to directly control the rendered
-HTML element. The `accessibilityRole` prop is used to infer an analogous [HTML5
+HTML element. The `accessibilityRole` prop is used to infer an [analogous HTML
-element](http://www.html5accessibility.com/) to use in addition, where
+element][html-aria-url] to use in addition, where possible. While this may
-possible. This also helps avoid certain HTML5 conformance errors and
+contradict some ARIA recommendations, it also helps avoid certain HTML5
-accessibility anti-patterns (e.g., giving a `heading` role to a `button`
+conformance errors and accessibility anti-patterns (e.g., giving a `heading`
-element).
+role to a `button` element).
 
 For example:
 
@@ -217,9 +229,12 @@ backing the current implementation of `Touchable`.
 Copyright (c) 2015 Nicolas Gallagher. Released under the [MIT
 license](http://www.opensource.org/licenses/mit-license.php).
 
+[aria-in-html-url]: https://w3c.github.io/aria-in-html/
 [contributing-url]: https://github.com/necolas/react-native-web/blob/master/CONTRIBUTING.md
 [flexbox-guide-url]: https://css-tricks.com/snippets/css/a-guide-to-flexbox/
 [gitter-url]: https://gitter.im/necolas/react-native-web
+[html-accessibility-url]: http://www.html5accessibility.com/
+[html-aria-url]: http://www.w3.org/TR/html-aria/
 [npm-image]: https://badge.fury.io/js/react-native-web.svg
 [npm-url]: https://npmjs.org/package/react-native-web
 [react-native-url]: https://facebook.github.io/react-native/

docs/apis/StyleSheet.md

@@ -134,16 +134,6 @@ style sheet growth in a similar way. But they're CSS utility libraries, each wit
 particular set of classes and features to learn. All of them require developers
 to manually connect CSS classes for given styles.)
 
-### Media Queries, pseudo-classes, and pseudo-elements
-
-Media Queries in JavaScript can be used to modify the render tree and styles.
-This has the benefit of co-locating breakpoint-specific DOM and style changes.
-
-Pseudo-classes like `:hover` and `:focus` can be replaced with JavaScript
-events.
-
-Pseudo-elements are not supported.
-
 ### Reset
 
 React Native for Web includes a very small CSS reset taken from