Title: Screen reader text is visible
Last modified: July 24, 2020

---

# Screen reader text is visible

 *  Resolved [figure2](https://wordpress.org/support/users/figure2/)
 * (@figure2)
 * [5 years, 9 months ago](https://wordpress.org/support/topic/screen-reader-text-is-visible/)
 * Hello all, my screen reader text just appeared a few days ago and won’t disappear.
   I would prefer not to share the link because my client does not want their competitors
   knowing that they are developing a new website.
 * Below is a screenshot of what I am seeing:
 * [[
 * What should I be looking for?

Viewing 5 replies - 1 through 5 (of 5 total)

 *  Moderator [Steven Stern (sterndata)](https://wordpress.org/support/users/sterndata/)
 * (@sterndata)
 * Volunteer Forum Moderator
 * [5 years, 9 months ago](https://wordpress.org/support/topic/screen-reader-text-is-visible/#post-13165819)
 * What is the HTML for that link?
 * Are there errors in the browser console?
 *  Thread Starter [figure2](https://wordpress.org/support/users/figure2/)
 * (@figure2)
 * [5 years, 9 months ago](https://wordpress.org/support/topic/screen-reader-text-is-visible/#post-13165850)
 * The html for the screen reader link is just inside the site-container div:
    `
   <a class="skip-link screen-reader-text" href="#primary"><?php esc_html_e( 'Skip
   to content', 'spacelift-products' ); ?></a>`
 * Here is what is in my console:
    `DevTools failed to load SourceMap: Could not
   load content for https://www.spacelift-theme.markhannondesign.com/wp-content/
   themes/spacelift-products/js/popper.min.js.map: HTTP error: status code 404, 
   net::ERR_HTTP_RESPONSE_CODE_FAILURE`
 *  Moderator [Steven Stern (sterndata)](https://wordpress.org/support/users/sterndata/)
 * (@sterndata)
 * Volunteer Forum Moderator
 * [5 years, 9 months ago](https://wordpress.org/support/topic/screen-reader-text-is-visible/#post-13165916)
 * OK, on my test site, the skip to content link is
 * `<a class="skip-link screen-reader-text" href="#content">Skip to content</a>`
 * and this is the related CSS
 *     ```
       .screen-reader-text {
           border: 0;
           clip: rect(1px, 1px, 1px, 1px);
           clip-path: inset(50%);
           height: 1px;
           margin: -1px;
           overflow: hidden;
           padding: 0;
           position: absolute !important;
           width: 1px;
       }
       ```
   
 * Check the CSS for that class.
 *  Thread Starter [figure2](https://wordpress.org/support/users/figure2/)
 * (@figure2)
 * [5 years, 9 months ago](https://wordpress.org/support/topic/screen-reader-text-is-visible/#post-13165938)
 * It looks OK to me:
 *     ```
       /* Text meant only for screen readers. */
       .screen-reader-text {
       	border: 0;
       	clip: rect(1px, 1px, 1px, 1px);
       	clip-path: inset(50%);
       	height: 1px;
       	margin: -1px;
       	overflow: hidden;
       	padding: 0;
       	position: absolute !important;
       	width: 1px;
       	word-wrap: normal !important;
       }
   
       .screen-reader-text:focus {
       	background-color: #f1f1f1;
       	border-radius: 3px;
       	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
       	clip: auto !important;
       	clip-path: none;
       	color: #21759b;
       	display: block;
       	font-size: 0.875rem;
       	font-weight: 700;
       	height: auto;
       	left: 5px;
       	line-height: normal;
       	padding: 15px 23px 14px;
       	text-decoration: none;
       	top: 5px;
       	width: auto;
       	z-index: 100000;
       }
       ```
   
 *  Thread Starter [figure2](https://wordpress.org/support/users/figure2/)
 * (@figure2)
 * [5 years, 9 months ago](https://wordpress.org/support/topic/screen-reader-text-is-visible/#post-13166490)
 * Hello Steven, just letting you know I solved it. The problem turned out to be
   a missing “}” farther down in the CSS.
 * I am using the Underscores theme and fortunately the team that built it organized
   the CSS into sections. I deleted all the sections and replaced them one by one
   until the screen reader text reappeared.

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Screen reader text is visible’ is closed to new replies.

## Tags

 * [screen-reader](https://wordpress.org/support/topic-tag/screen-reader/)
 * [Skip to Content](https://wordpress.org/support/topic-tag/skip-to-content/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 5 replies
 * 2 participants
 * Last reply from: [figure2](https://wordpress.org/support/users/figure2/)
 * Last activity: [5 years, 9 months ago](https://wordpress.org/support/topic/screen-reader-text-is-visible/#post-13166490)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics