Rounded Menu Items Create Boxes Around Them When Clicked?


Author Message
Alan S

Posted: 2/12/2011
Quote message 

I am new to Joomla. I want to create menu items that work like the buttons on this website. When I make rounded menu items in Artisteer, they look fine and change color when they are rolled over, but when they are clicked they develop a rectangle border around the outside of them that doesn't go away until I click on a different menu item. I would like to clean that up if possible. How do I create menu items with rounded corners that change colors but keep their native look without developing boxes around them when they are clicked? Would Wordpress or Drupal be a better choice over Joomla for this requirement? Thank you, I am very much looking forward to learning how to use Artisteer.
 
Phil

Posted: 2/12/2011
Quote message 

The dotted boxes you speak of are an accessibility aid (for the visually impaired etc) and their removal isn't recommended having said that, if you really insist on getting rid of them, add the following to the template.css for your site:

/* remove dotted boxes around images */
a {
outline: 0 !important;
}
a:active {
outline: none !important;
}

 
Alan S

Posted: 2/12/2011
Quote message 

Thank your for the reply Phil, since they have a useful purpose, is it possible to leave them in place but make them invisible? Thanks again
 
Mark C

Posted: 2/12/2011
Quote message 

Alan, if you leave them there but make them invisible, they won't be very helpful to the visually impaired.
 
Alan S

Posted: 2/12/2011
Quote message 

What do the boxes do? The visually impaired friends that I have in my life are blind, so it would not matter to them (they use a program called JAWS to navigate through computers), and I figured a visually impaired person would more likely see a colored button than a faint brown line around it. Thanks for the input, all info is appreciated.
 
Phil

Posted: 2/12/2011
Quote message 

It's there mainly for people who don't use a mouse (some disability) or "power users" who use keyboard shortcuts to navigate to be able to see which item has focus. Also, people with visual impairment (other than totally blind) can use this to aid navigation.
See this demo and use the tab key (or shift-tab to back-up) to navigate:
http://haslayout.net/tut-demos/outline-on-links-regular.html#