I have a ul and I want to fix the width of the ul to content. Currently I use -moz-max-content but there is some problem in non-mozilla browsers.
How can I implement the -moz-max-content?
Use max-width: intrinsic;. This works for webkit browsers (Chrome & Safari).
Be aware that attributes starting with -moz are only working in Mozillas Firefox. The common prefixes are:
-moz for Firefox
-webkit for Webkit (mainly Chrome & Safari and a lot of the Chromium forks)
-ms for IE10
-o for Opera
As written at http://msdn.microsoft.com/library/ms530811.aspx you can only define pixels or percentage. The max-width property itself is supported since IE7.
It might be that you can use a max-width: 100%; for IE, but I'm unsure if the results are the same.
Related
I want to do the styling of scroll bar. It's working in chrome but it isn't working in Firefox. How do I solve this?
As you will have found the code for custom scrollbars is ::-webkit-scrollbar using the webkit system
Unfortunately not all browsers support webkit, you'll find Webkit works on browsers such as Chrome & Safari but Firefox uses -moz and I.E. uses -ms. Because of this, scrollbar design will work on webkit browsers only. There is no -moz or -ms equivalent.
You can read more on the Mozilla Developer pages about scrollbar design
I'm playing with CSS perspective and I don't get the same result between firefox and chrome/ie.
I want it to work as in chrome/ie (the flipping panel doesn't go over the non flipping cat when it closes).
Here the codepen.io I made for the question :http://codepen.io/mourtazag/pen/cdAuL
Thanks !
you may not be using proper vendor prefix.
-khtml- (Konqueror, really old Safari)
-moz- (Firefox)
-o- (Opera)
-ms- (Internet Explorer)
-webkit- (Safari, Chrome)
and also dont forget to use default code, i.e. code without vendor prefix.
The Browser Safari falls under Webkit or not? Please do clarify my doubt at the earliest. If it is not falls under the category of Webkit, what steps would I take to write in CSS. I mean the syntax of CSS for Safari Browser Like -moz for Filezilla and -webkit for Chrome?
Safari is webkit based. In fact safari was the first browser to use webkit and the open source it. The -webkit should work.
You can read more here:
http://en.wikipedia.org/wiki/Safari_(web_browser)
http://www.webkit.org/
In order to make touch screen friendly website IE supports
canvas {
-ms-touch-action: double-tap-zoom;
}
Is there any equivalent to be used with other browsers like chrome, Firefox, opera and safari?
Chrome is shipping support for touch-action in Chrome 35: http://blog.chromium.org/2014/04/chrome-35-beta-more-developer-control.html
There is no other way of implementing this in other browsers, see Krazers answer to this.
https://stackoverflow.com/a/10291359/1977007
I'm working on some boxes where I'm forced to using the following css on a div in order to make it look right:
display:table;
It works fine in Firefox + Internet Explorer, but I just noticed that it adds a 1px border/margin/padding in webkit browsers (Safari / Chrome), which moves the box a bit... How can I get rid of this?
I've uploaded a picture example of how it's rendered:
http://imageshack.us/photo/my-images/854/examplez.jpg/
Is there a "simple way" of determining in the stylesheet whether you are using a webkit browser or not? Because then I could just add a "margin-left:-1px".. I know there is a way of determining the browsertype in jQuery, but I think it's kind of overkill for this..