Menu icon Foundation
-webkit-flex property not working in safari

While using Maverick OS on a MacBook Air in Safari, properties attached with prefix -webkit is not functioning properly. It's present in the stylesheet but when we access in above specification it is not visible in styles, hence, page breaks completely.

FlexpropertycssMaverick OSmacbookSafari

While using Maverick OS on a MacBook Air in Safari, properties attached with prefix -webkit is not functioning properly. It's present in the stylesheet but when we access in above specification it is not visible in styles, hence, page breaks completely.

Rafi Benkual over 2 years ago

 There should be a autoprefixer pipe in the gulpfile that adds the vendor prefixes. Are you not seeing them in the browser?

Rucha over 2 years ago

We changed gulpfile as follow:

.pipe($.autoprefixer({

          browsers: ['last 2 versions', 'safari 5', 'ie 8', 'ie 9', 'ie 10', 'opera 12.1', 'Firefox ESR']

}))

But still it's not working for me. The styles related to display property strikes out.

Brian over 2 years ago

ZURB has basically dropped support for this framework and it is now being maintained in angular-base-apps.

This bug has been fixed in that repo: https://github.com/base-apps/angular-base-apps/issues/5

chirag 4 months ago

hello

 

chirag 4 months ago

safari flex css is not working !  please help me

chirag 4 months ago

          browsers: ['last 2 versions', 'safari 5', 'ie 8', 'ie 9', 'ie 10', 'opera 12.1', 'Firefox ESR']

Rucha 4 months ago

Flex property does not have support for 'safari 5', 'ie 8', 'ie 9', 'ie 10'.

You can add following prefixes for flex property:

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

 

Rucha 4 months ago

Flex property does not have support for 'safari 5', 'ie 8', 'ie 9', 'ie 10'.

You can add following prefixes for flex property:

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

 

Rucha 4 months ago

Flex property does not have support for 'safari 5', 'ie 8', 'ie 9', 'ie 10'.

You can add following prefixes for flex property:

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;