How to use css calc () on safari?

Question

How to use css calc () on safari?

Navigation

#1 by (7 votes)
#2 by (1 votes)

2

The calc () on safari is not working. I tried to put the prefixes and it did not work either. Does anyone know a solution?

I'm using this way:

#myDiv{
        width: calc(100% - 160px);
        width: -webkit-calc(100% - 160px);
        width: -moz-calc(100% - 160px);
}

Solution:

Folks, I'm using version 5.1 of the Safari and if the Can I Use , this property does not support this version.

html css

asked by anonymous 07.03.2014 / 15:40

2 answers

Should old tags and branches be deleted from the remote repository? Concatenate array of selected checkboxes to use as search filter

score 7 · Answer 1

only works from Safari 6 and the order has to be reversed

width: -webkit-calc(100% - 100px);  /* para Chrome */
width: -moz-calc(100% - 100px);     /* para Firefox */
width: calc(100% - 100px);          /* para suporte nativo */

If you use Safari on Windows, you can forget that Apple left Safari in version 5.1.7

score 1 · Answer 2

Check compatibility

This and other properties can be viewed through CanIUse

width: -webkit-calc(100% - 100px);  /* Chrome */
width: -moz-calc(100% - 100px);     /* Firefox */
width: -ms-calc(100% - 100px);      /* microsoft */
width: -o-calc(100% - 100px);       /* Opera */
width: calc(100% - 100px);          /* Nativo */

The native property should be the last one for ease of compatibility.

The rule's specification can be found on the W3C site (a direct link to the calc )