diseño flexible de paginas web

[franfis]

Hola amigos, aquí molestando otra vez 

Sobre el diseño de paginas para que quepan en ipad iphones, etc, en cualquier dispositivo.
Estuve viendo un tutorial de "flex model html5" que utiliza propiedades como:

Código [Seleccionar] Expandir

display: -webkit-box;
-webkit-box-orient:vertical;
-webkit-box-flex:1;

Tambien vi otra de "Responsive Design with CSS3" que utiliza "media queries" asi:

Código [Seleccionar] Expandir

@media screen and (max-width:1080px){
}

Mi pregunta es ¿cual de las dos es la forma correcta de hacer a una web flexible? o si tienen el mismo propósito ambos, ¿son modelos diferentes?.

A mi entender las sentencias que puse en el primero son de transicion ya que "todavía" los browser no lo soportan.

Bueno gracias por las respuestas, quiero seguir tutoriales de esto pero no se, el primero lo estuve viendo en youtube pero en los comentarios dicen algo como "¿pero todavia es valido este codigo?" otros responden "ya no", el video es del 2011.

[s00rk]

Lo correcto es hacer uso de media queries.
Así hacer una web responsiva(adaptable a cualquier resolución).

Igualmente algo que me ha servido a mi a la hora de hacer fronted es primero empezar con el diseño hacia móviles y al final hacia una pantalla de computadora.

Lo otro que colocaste realmente nunca las he usado ni visto anteriormente asi que no se de que sirvan, pero a lo que preguntas lo mejor es hacer uso de media queries hehe.