display:flex;

[torsuntsu]

Hello,i have a problem with the css rule display: flex. Well to be honest, the problem is with the Safari browser. Every other browser displays the page as i intend it to display, but with Safari there´s a problem. I have a container with the class of promo that holds tree colomns with the class of coluna.

 

The CSS is as fallows:

.conteudo .promo {

max-width: 100%;

display:flex;

display:-webkit-flex;

flex-flow:row wrap;

-webkit-flex-flow:row wrap;

justify-content:center;

}

.conteudo .promo .coluna{

-moz-box-sizing:border-box;

-o-box-sizing:border-box;

-webkit-box-sizing:border-box;

box-sizing:border-box;

max-width: 32%;

padding: 5px;

margin: 5px;

display:flex;

display:-webkit-flex;

flex-flow:column;

-webkit-flex-flow:column;

}

Is there anything i´m doing wrong because only in Safari the page isn´t displayed as it should.I´d really need some help. Please!!!!The page is on: www.sistemagestorconteudos.net/Alfaccop/Sitio8

Torsuntsu

 

[newseed]

Some browsers do not fully support all the CSS3 elements. Try this:

 

display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;

[theSCV]

The flex property is supported in all major browsers, except for Safari.

 

 

look here

http://www.w3schools.com/cssref/css3_pr_flex.asp

[newseed]

 

look here

http://www.w3schools.com/cssref/css3_pr_flex.asp

 

"The flex property is not supported IE 9 or earlier, in IE 10 this property is supported with the prefix -ms-."