Multi Browser Design

off.the.walls · 14-03-2013 10:05PM #1

I'm trying to code a website and I am using some -webkit- features for the navigation however these don't seem to work in Firefox, how can i get around this problem? or how do i style seperately for multi browswers?

SweetCaliber · 14-03-2013 10:40PM

replace -wekbit- with -moz-

However most css3 browsers now you can remove the prefixes:

Such as:

-moz-border-radius: 3px;
-webkit-border-radius: 3px;

Can now be:

border-radius: 3px;

off.the.walls · 14-03-2013 11:01PM

Say you want something to be moved with a webkit so you have webkit-transform: translate(x,y) and you want to fix it up so it works on firefox do you use moz for that?

Sorry if its a basic question but need to be sure this site displays the same across everything!

SweetCaliber · 14-03-2013 11:17PM

Yep

-moz-transform: translate(x,y)

Add in:

transform: translate(x,y)

Also, as for safari and so on (CSS3 Compatible browsers) will be able to take advantage of it also

off.the.walls · 14-03-2013 11:22PM

Brilliant thank you

KonFusion · 14-03-2013 11:48PM

This is worth a read

http://coding.smashingmagazine.com/2011/05/03/using-css3-older-browsers-and-common-considerations/

Multi Browser Design

Comments