user2997418 user2997418 - 1 year ago 81
HTML Question

CSS hide a <a> text without hiding the image

I have a language menu, flag+ text, for small devices I want to display only the I want to not display 'English' and 'Deutsch'

enter image description here

The post how do i hide anchor text without hiding the anchor didn't solve my problem, so it is not a duplicated post. If I try it I get this result :

enter image description here

The menu is based on


<a id="en" class="current" href="...">
<ul class="dropdown" style="display: none;">
<a id="de" href="...">Deutsch</a>

css :

@media (max-width: 500px) {

#en {
background-image: url(../images/flags/gb.png);
#de {
background-image: url(../images/flags/de.png);

Answer Source

With the text-indent:


    text-indent: -999999px;

i hope this works for you

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download