WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I'm trying to style a custom menu here so that I can let other people manage this site alongside myself.

What I'm trying to do is remove the text for the top level links while leaving the a as a block so the links are clickable, however when I try and remove the text using text-indent: -999em; (which I know isn't the neatest way of doing it) it recurses down the menu and hides all the the other links.

Can anyone suggest any neat ways of hiding the text?

share|improve this question
up vote 1 down vote accepted

I think you can use the text-indent for this level, but you must set the text-indent for all a -tags of the class sub-menu also set to 0, not -999px.


#menu-main-navigation .link-experience a {
display: block;
height: 63px;
width: 167px;
text-indent: -999px;

.sub-menu a {
text-indent: 0px !important;
share|improve this answer
It didn't work at first but I used Firebug and noticed that the .sub-menu a was being overwritten by the #menu-main-navigation's text-indent, so I gave the sub-menu an !important and it seems to have worked! – rickbutterfield Aug 23 '11 at 13:30
the fastest variant is to use the !important element – bueltge Aug 23 '11 at 14:55

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.