html - 无法让 "text replacement"在简单的 div 上工作，为什么？

Question

我正在做一些愚蠢的事情......但是，我就是看不到它。我正在尝试将我的文本移到屏幕外以适应屏幕阅读器——并使用背景图像进行演示

<div class="memberstatus-clubmember">
    Clubmember
</div>


.memberstatus-clubmember {
   background: transparent url(/memberStatus/clubmember.png) no-repeat 0 0;
   display:block;
   width:193px; /* width of image */
   height:15px; /* height of image */
   text-indent:-999999px; 
}

Answer 1

尝试添加position: absolute;

.memberstatus-clubmember {
   background: transparent url(/memberStatus/clubmember.png) no-repeat 0 0;
   display:block;
   width:193px; /* width of image */
   height:15px; /* height of image */
   text-indent:-999999px; 
   position: absolute;
}

这应该有帮助:

• > CSS text-indent: An Excellent Trick To Style Your HTML Form