Safari дисплей браузера прогибается выпуск

Question

Был пост здесь в Stack вчера, где кто-то хотел, чтобы этот список Описание фрагмент кода:

<dl> 
    <dt>term1</dt><dd>defn1</dd> 
    <dt>term2</dt><dd>defn2</dd> 
    <dt>term3</dt><dd>defn3</dd> 
</dl> 

Для отображения в этом формате:

term1 term2 term3 
defn1 defn2 defn3 

Это CSS решение, Я придумал:

div { 
    width: 50%; 
} 

dl { 
    -ms-flex-direction: row; 
    -moz-flex-direction: row; 
    -webkit-flex-direction: row; 
    flex-direction: row; 

    -ms-flex-wrap: wrap; 
    -moz-flex-wrap: wrap; 
    -webkit-flex-wrap: wrap; 
    flex-wrap: wrap; 

    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6 */ 
    display: -moz-box;   /* OLD - Firefox 19- (buggy but mostly works) */ 
    display: -ms-flexbox;  /* TWEENER - IE 10 */ 
    display: -webkit-flex;  /* NEW - Chrome */ 
    display: flex;    /* NEW, Spec - Opera 12.1, Firefox 20+ */ 
} 

dt { 
    -webkit-box-flex: 0 0 30%;  /* OLD - iOS 6-, Safari 3.1-6 */ 
    -moz-box-flex: 0 0 30%;   /* OLD - Firefox 19- */ 
    -moz-flex: 0 0 30%; 

    -webkit-flex: 0 0 30%;   /* Chrome */ 
    -ms-flex: 0 0 30%;    /* IE 10 */ 
    flex: 0 0 30%;     /* NEW, Spec - Opera 12.1, Firefox 20+ */ 

    -webkit-box-ordinal-group: 1; 
    -moz-box-ordinal-group: 1;  
    -ms-flex-order: 1;  
    -webkit-order: 1; 
    order: 1; 

} 

dd { 
    -webkit-box-flex: 0 0 30%;  /* OLD - iOS 6-, Safari 3.1-6 */ 
    -moz-box-flex: 0 0 30%;   /* OLD - Firefox 19- */ 
    -moz-flex: 0 0 30%; 

    -webkit-flex: 0 0 30%;   /* Chrome */ 
    -ms-flex: 0 0 30%;    /* IE 10 */ 
    flex: 0 0 30%;     /* NEW, Spec - Opera 12.1, Firefox 20+ */ 

    -webkit-box-ordinal-group: 2; 
    -moz-box-ordinal-group: 2;  
    -ms-flex-order: 2;  
    -webkit-order: 2; 
    order: 2; 

    margin-left: 0; 
} 

Моя проблема, и я тщательно изучил, что это css решение doe s не работает только в браузере Safari. Рядом с дисплеем появляются восклицательные знаки: flex и flex-wrap в инспекторе браузера Safari. У кого-нибудь есть предложения?

Answer 1

flex будет поддерживаться в сафари 9.0 6.1 -webkit- .. проверьте ссылку здесь http://www.w3schools.com/cssref/css3_pr_flex.asp лучше использовать ширину: 30%; а не flex