WP Admin Bar transparent on some pages (.screen-reader-shortcut)

I have an issue where the WP Admin Bar is transparent on some pages on the site. It’s there and all the links are clickable, however, it is not viable.

I am using a child version of the Divi Theme but the issue is still there when I make the switch back to the standard theme.

When I inspect the page I notice that the following CSS is active.

#wpadminbar .screen-reader-shortcut {
position: absolute;
top: -1000em;
}

If I remove the ‘top: -1000em;’ then the bar appears. I am not sure why style is active and it is being taken from the ‘admin-bar.min.css’ which I have not overwritten or made any changes to.

My question is has anyone else come across this issue and do you have a recommendations to fix it without just overwriting the style?

Read more here:: WP Admin Bar transparent on some pages (.screen-reader-shortcut)

Leave a Reply

Your email address will not be published. Required fields are marked *