[Résolu] Imbrication avec flex

Bonsoir

Je continue mon chemin avec flex, je bloque sur l'imbrication de 2 blocs
A gauche recherche et locations sur cette page

http://goxo.eu/flex/flex7000.html

Sur Firefox çà passe,
(en arrière plan des blocs j'ai mis le conteneur aside en rouge)

Sur tous les autres navigateurs les blocs se touchent, l'espace est à droite des blocs

Sur aside (conteneur des 2 blocs) j’ai mis le code css suivant

aside{flex:0.43;justify-content:space-between;flex-direction:row;display:inline-flex;background-color:red}
.recherche{flex:0.48;background:#1e90ff; border-radius: 10px;}
.inscrits{flex:0.48;background:#1e90ff; border-radius: 10px;}

Une petite explication ???


Merci


Bonne soirée


BB
Modifié par africa (11 Mar 2016 - 20:10)

le resultat me surprend (autant dans FF que chrome),

peut-etre vaut-il mieux ecrire les 3 valeurs de flex pour qu'il n'y est aucune ambiguité:

Apparement chrome interprète la règle raccourcie comme: flex:0.48 1 0%;

test:

.recherche {
    flex-grow:0 ;
    flex-shrink:1;
    flex-basis:48%;
    background: #1e90ff;
    border-radius: 10px;
  }

http://codepen.io/anon/pen/jqrRjq?editors=0100

ou

 .inscrits {
    flex: 0 1 48%;
    background: #1e90ff;
    border-radius: 10px;
  }

http://codepen.io/gcyrillus/pen/aNZxrE?editors=0100
Modifié par gcyrillus (12 Mar 2016 - 01:11)

Un grand merci gcyrillus

Super d'avoir mis le code sur "codepen", c'est nickel, je vais m'empresser de regarder les modifications apportées sur le code.
Vous êtes géniaux sur ce forum ......

Bon week end

BB