diff --git a/bookwyrm/static/css/bookwyrm.css b/bookwyrm/static/css/bookwyrm.css
index 6f6a9f26..13402313 100644
--- a/bookwyrm/static/css/bookwyrm.css
+++ b/bookwyrm/static/css/bookwyrm.css
@@ -179,7 +179,7 @@ button .button-invisible-overlay {
 
 button:hover .button-invisible-overlay,
 button:active .button-invisible-overlay,
-button:focus .button-invisible-overlay {
+button:focus-visible .button-invisible-overlay {
     opacity: 1;
 }
 
diff --git a/bookwyrm/templates/book/book.html b/bookwyrm/templates/book/book.html
index bdca078a..4903da87 100644
--- a/bookwyrm/templates/book/book.html
+++ b/bookwyrm/templates/book/book.html
@@ -74,6 +74,9 @@
                             <span>{{ book.alt_text }}</span>
                             <span>{% trans "Click to add cover" %}</span>
                         </span>
+                        <span class="button-invisible-overlay has-text-centered">
+                            {% trans "Click to add cover" %}
+                        </span>
                     </button>
                     {% include 'book/cover_add_modal.html' with book=book controls_text="add_cover" controls_uid=book.id %}
                     {% if request.GET.cover_error %}
@@ -87,7 +90,7 @@
             {% if book.cover %}
                 <button type="button" data-modal-open="cover_show_modal" class="cover-container is-h-m-mobile is-relative">
                 {% include 'snippets/book_cover.html' with size='xxlarge' size_mobile='medium' book=book cover_class='is-h-m-mobile' %}
-                    <span class="button-invisible-overlay">
+                    <span class="button-invisible-overlay has-text-centered">
                         {% trans "Click to enlarge" %}
                     </span>
                 </button>