Propiedad abreviada flex en CSS

La propiedad flex es una abreviatura para las propiedades de expansión, contracción y tamaño. El orden de las propiedades abreviadas es importante y es el siguiente: flex-grow, flex-shrink, flex-basis. Las propiedades se pueden omitir desde el final, en cuyo caso tomarán el valor por defecto.

Задание 1

Reescribe el siguiente código usando la propiedad abreviada flex:

css.child {
  flex-basis: 100px;
  flex-grow: 1;
  flex-shrink: 2;
}

Задание 2

Reescribe el siguiente código usando la propiedad abreviada flex:

css.child {
  flex-shrink: 0.5;
  flex-grow: 2;
}

Задание 3

Reescribe el siguiente código usando la propiedad abreviada flex:

css.child {
  flex-shrink: 0.5;
  flex-grow: 1;
}

Задание 4

Reescribe el siguiente código usando las propiedades expandidas:

css.child {
  flex: 1 2 200px;
}

Задание 5

Reescribe el siguiente código usando las propiedades expandidas:

css.child {
  flex: 2 0.7;
}

Задание 6

Reescribe el siguiente código usando las propiedades expandidas:

css.child {
  flex: 3;
}