Selected Item - Dashed border removal

  • dyfrin
  • Expert
  • Expert
  • User avatar
  • Posts: 503
  • Loc: WI

Post 3+ Months Ago

Hello, found something I can't find a solution for.

In a form, I have:
Code: [ Select ]
<button type="submit" name="button" tabindex="5" id="submitter"></button>


and the css is:
Code: [ Select ]
#submit button{
 background: url(images/senddim.png);
 height: 80px;
 width: 200px;
 border: none;
 }
#submit button:hover{
 background: url(images/sendlit.png);
 }
  1. #submit button{
  2.  background: url(images/senddim.png);
  3.  height: 80px;
  4.  width: 200px;
  5.  border: none;
  6.  }
  7. #submit button:hover{
  8.  background: url(images/sendlit.png);
  9.  }


When said button is clicked, it gives an ajax message, either a success or failure.

In Firefox there is a dashed line that remains around the button.
In IE there is not, and looks better that way.

Any ideas on how to remove it from Firefox?
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • kbergmann
  • Expert
  • Expert
  • User avatar
  • Posts: 659
  • Loc: USA

Post 3+ Months Ago

have you tried adding border:none; to the hover event? That might do it?

#submit button:hover{

background: url(images/sendlit.png);
border: none;

}
  • dyfrin
  • Expert
  • Expert
  • User avatar
  • Posts: 503
  • Loc: WI

Post 3+ Months Ago

have tried that, as it is not still "hovering" it is after the fact.

here is a three layer png showing the various states:

http://www.dyfrin.com/ozzu/image.png
  • digitalMedia
  • a.k.a. dM
  • Genius
  • User avatar
  • Posts: 5149
  • Loc: SC-USA

Post 3+ Months Ago

You might try an image type input and "input:focus{-moz-outline:none;}"

However, the focus indicator is helpful for people who aren't using a mouse.
  • dyfrin
  • Expert
  • Expert
  • User avatar
  • Posts: 503
  • Loc: WI

Post 3+ Months Ago

alas it fails, perhaps the better solution is just remove focus from the button when ajax populates the message. Will try it!

Post Information

  • Total Posts in this topic: 5 posts
  • Users browsing this forum: ScottG and 67 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.