homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Browsers / Firefox Browser Usage and Support
Forum Library, Charter, Moderators: incrediBILL

Firefox Browser Usage and Support Forum

How to get rid of the dotted box

 8:00 pm on May 19, 2007 (gmt 0)

I have a set of tabs created with JavaScript and CSS, which are correct from a functional point of view. There is just one minor cosmetic detail - after rendering itself and its intended result correctly, the actual tab that was pressed has a thin rectangular dotted box around it which completely ruins the UI effect I am trying to achieve. If I click away anywhere in the page it disappears. I have text-decoration: none specified.

I have some other tabs in other pages that do not have this after-effect but cannot see why they are behaving differently form the ones that have the problem.




 8:07 pm on May 19, 2007 (gmt 0)

hi try
-moz-outline: none;
in you style sheet defs: eg:

.bigbutton:focus {-moz-outline: none; /* fx 1.07*/ outline:none /* fx 1.05,
Safari, Mac IE*/}


 8:58 pm on May 19, 2007 (gmt 0)

Note that the dotted box (or an alternative) is an accessibility requirement - it adds a visial clue when navigating the site links via a keyboard. Removing the accessibility aid reduces the usability of your site by making a mouse obligatory for visual navigation.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Browsers / Firefox Browser Usage and Support
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved