Kilotest: Diagnoses of CSS bans page rotation
violation by HTML element 0 on Portland Community College page
Basics
About the Portland Community College page
- URL: https://www.pcc.edu/
- Tested 38 days ago by job
icoon 2026-04-24 at 19:44
About HTML element 0
- Tag name:
HTML - Text: [not applicable]
- Start tag:
<html class="" lang="en" data-whatinput="keyboard" data-whatintent="keyboard"> - XPath:
/html - Bounding box: x = 0, y = 0, width = 1920, height = 7927
About the CSS bans page rotation
issue
- Why it matters: User must read sideways after rotating a device
- Priority: highest
- Related WCAG standard: 1.3.4
Diagnoses
Here is how tools diagnose the CSS bans page rotation
issue for HTML element 0 of the Portland Community College page.
- You have defined <acronym title="Cascading Style Sheets">CSS</acronym> orientation media feature <code>screen and (orientation: landscape)</code> in <acronym title="Cascading Style Sheets">CSS</acronym> (location: <code>https://www.pcc.edu/wp-content/themes/pcc/_source/vendor/foundation/6.8.1/foundation.min.css</code>, cssText: <code>@media screen and (orientation: landscape) {
.hide-for-portrait, .show-for-landscape { display: bl [...]</code>).
Make sure that there is no message telling the user to reorient the device. The entirety of the author-controlled content needs to be re-oriented in order to meet the Success Criteria.
Note about location: If the style sheet is a linked style sheet, the value of its attribute is its location. For inline style sheets, the value of this attribute is <code>null</code>.
Tool: ASLint (eSSENTIAL Accessibility)
Rule:
orientation - You have defined <acronym title="Cascading Style Sheets">CSS</acronym> orientation media feature <code>screen and (orientation: portrait)</code> in <acronym title="Cascading Style Sheets">CSS</acronym> (location: <code>https://www.pcc.edu/wp-content/themes/pcc/_source/vendor/foundation/6.8.1/foundation.min.css</code>, cssText: <code>@media screen and (orientation: portrait) {
.hide-for-portrait, .show-for-landscape { display: non [...]</code>).
Make sure that there is no message telling the user to reorient the device. The entirety of the author-controlled content needs to be re-oriented in order to meet the Success Criteria.
Note about location: If the style sheet is a linked style sheet, the value of its attribute is its location. For inline style sheets, the value of this attribute is <code>null</code>.
Tool: ASLint (eSSENTIAL Accessibility)
Rule:
orientation - You have defined <acronym title="Cascading Style Sheets">CSS</acronym> orientation media feature <code>screen and (orientation: landscape)</code> in <acronym title="Cascading Style Sheets">CSS</acronym> (location: <code>https://www.pcc.edu/wp-content/themes/pcc/_source/vendor/foundation/6.8.1/foundation.min.css</code>, cssText: <code>@media screen and (orientation: landscape) {
.hide-for-landscape, .show-for-portrait { display: no [...]</code>).
Make sure that there is no message telling the user to reorient the device. The entirety of the author-controlled content needs to be re-oriented in order to meet the Success Criteria.
Note about location: If the style sheet is a linked style sheet, the value of its attribute is its location. For inline style sheets, the value of this attribute is <code>null</code>.
Tool: ASLint (eSSENTIAL Accessibility)
Rule:
orientation - You have defined <acronym title="Cascading Style Sheets">CSS</acronym> orientation media feature <code>screen and (orientation: portrait)</code> in <acronym title="Cascading Style Sheets">CSS</acronym> (location: <code>https://www.pcc.edu/wp-content/themes/pcc/_source/vendor/foundation/6.8.1/foundation.min.css</code>, cssText: <code>@media screen and (orientation: portrait) {
.hide-for-landscape, .show-for-portrait { display: blo [...]</code>).
Make sure that there is no message telling the user to reorient the device. The entirety of the author-controlled content needs to be re-oriented in order to meet the Success Criteria.
Note about location: If the style sheet is a linked style sheet, the value of its attribute is its location. For inline style sheets, the value of this attribute is <code>null</code>.
Tool: ASLint (eSSENTIAL Accessibility)
Rule:
orientation