Código:
body {
background: silver;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
font-family: arial, sans-serif;
margin: 0;
text-align: center;
}
yo hasta donde tengo entendido, la propiedad de Display:flex se recomienda en algun contenedor o caja, No es recomendable usar FlexBox para crear la disposición de toda la página
Código:
body>* { /** PRUEBAS VISUALES **/
background: white;
box-shadow: 0 0 1px 0 silver;
flex: 1 100%;
padding: 1em 0;
}
no se por que utilizas esto amigo
Código:
nav {
display: inherit;
justify-content: space-around;
a {
color: #333;
text-decoration: none;
}
}
¿por que pones
display: inherit;? ¿si te funciona el estilo que le das al hipervinculo del nav?, yo por lo general lo pondria de la siguiente manera
Código:
nav {
display: inherit;
justify-content: space-around;
}
nav a {
color: #333;
text-decoration: none;
}
Código:
@media all and (min-width: 601px) {
header, nav, aside { flex: 1 auto; }
header {width: 20%;}
nav {width: 80%;}
}
no estoy seguro si sea posible asignarle un mismo valor a 3 etiquetas, hasta donde tenia entendido, se le daba un valor diferente, para que aparecieran en ese orden.
yo creo que para poder responder mejor la pregunta si ¿esta correcto o le cambiaria algo? seria
1) ver al menos la estructura en imagen de lo que quieres hacer, lo digo por que veo que faltan algunas etiquetas extra
2) ver y hacer un análisis estadístico sobre los navegadores compatibles que hay con esta tecnología, con la finalidad de que el usuario final pueda disfrutar de la navegación
en mi caso, que soy de México, las estadísticas que tengo sobre mi país son las siguientes
Enero 2014 - Octubre 2014
Uso de dispositivos móviles 28.13% (Celulares 21.82, Tablets 6.31)
PC 71,87%
Estos resultados afirman que hay que utilizar tecnología web para la programación de sitios móviles, por tener un 30% del mercado Nacional, pero, para determinar si es buen momento de usar display Flex o no, nos lo determinaran otras gráficas
Navegadores para PC en Mexico
Tenemos a Chrome con sus diferentes versiones como el rey de los Navegadores a nivel Nacional con el 58.3%, después tenemos a firefox con el 12.59% (en las versiones 5+)
pero, tenemos a 4 IE que sumados nos da el 22.41% (IE11 9.11%, IE10 5.07%, IE8 4.85%, IE9 3.38%)
En el caso de safari, 1.97% esta por debajo de la versión 7 y 1.79% esta en la versión 7, una vez que tenemos estos datos en cuenta, podemos compararlos con nuestra tabla de compatibilidad con FLEXBOX
si hacemos sumas de los porcentajes de IE8 e IE9, 4.85% + 3.38% un total de 8.23% considerable, es casi el mismo resultado que nos da la misma imagen de la diferencia de 100%- 91.67% = 8.33%
Los usuarios de PC que podrían navegar sin tanto problema en México seria el
65.87% (considerando que 71.87% seria nuestro 100% y que el 8% de 71.85% es 5.98%)
también tenemos gráficas donde se involucran los dispositivos móviles
pero, a la falta de información específica sobre las versiones de los navegadores para dispositivos móviles, + la mezcla que hace en estas estadísticas con los navegadores para PC, es muy pronto para dar una valoración estadística cuantitativa sobre display:flex en los dispositivos móviles, tal vez en lo que me podría basar para tener un numero seria en el resultado de la resta de 100%- 73.95% que no requieren prefijos, esto me daria un total de 26.05%, aplicando esto a nuestro 28.13% tendria un
20.81%
haciendo la sumatoria de los usuarios que podrían disfrutar de la web usando display flex seria 65.87% + 20.81 =
86.68% dejando fuera un
13.32%.
Como conclusión, es bueno empezar a introducirme a esta tecnología, pero, tal vez esperaría unos 6 meses mas o 1 año para ver como evoluciona las estadísticas y ver que ese 13% por lo menos disminuya a menos del 5%
Por ultimo, dejo los enlaces de las estadisticas que genere
http://caniuse.com/#search=flexbox http://gs.statcounter.com/#all-compa...310-201410-bar
espero que mi respuesta te sirva de algo amigo, cualquier cosa, comenta
