Targetting CSS styles for Mozilla Firefox Only

Posted by on November 2, 2011 in Web Servers, Website Design | 0 comments

Targetting CSS styles for Mozilla Firefox Only

Every now and again you need to taget a specific browser with a style because your main style just doesn’t perform right. Usually it’s Internet Explorer acting up for me, but this time it was Firefox. For some reason, I had a text field that was changing sizes 1 pixel smaller on Firefox than it did on every other browser on my hover event. Therefore I needed to change the border for only Firefox. You could create a specific stylesheet for Firefox, but that could get messy as you update things, and it creates more server processing. Using the code below in your stylesheet, you can include it right along side all your other styles.

@-moz-document url-prefix() {
input:hover
{
border:1px solid #888888;
}
}
If you enjoyed this post, please consider leaving a comment or subscribing to the RSS feed to have future articles delivered to your feed reader.

Leave a Comment

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>