Cuando se crean esquemas de mashup con varios contenedores en el mismo nivel, se pueden definir los valores de Aumentar relación y Disminuir relación para cada contenedor. Los valores de la relación se utilizan para definir el espacio disponible que se conserva para cada contenedor del esquema. Hay dos maneras de aplicar los valores de la relación para definir un esquema de mashup. Las relaciones se pueden aplicar al espacio vacío restante del contenedor o al tamaño completo del contenedor. Por defecto, las relaciones se aplican al espacio restante que se encuentra alrededor de los widgets dentro del contenedor. Este método es más flexible y se puede utilizar para aprovechar el espacio vacío adicional del esquema, si fuera necesario. Opcionalmente, se puede configurar la distribución de la relación para crear esquemas donde la relación del contenedor permanezca constante cuando cambien las cotas de la ventana, sin factorizar los elementos de cada contenedor. Por ejemplo, en la siguiente figura se muestra un mashup con tres contenedores.

En cada contenedor se muestra un número diferente de elementos. El valor de Aumentar relación del primer y segundo contenedor se define en 1 y la relación del tercer contenedor se define en 2. Por defecto, se calcula el espacio que rodea a los widgets dentro de cada contenedor y el aumento y disminución de la relación se aplica al espacio restante. En este ejemplo, se muestra el contenido completo del contenedor 2 y es mayor que el del contenedor 1, que tiene el mismo aumento de relación y un solo widget. El espacio alrededor de los widgets del contenedor 3 es el doble del tamaño de los contenedores 1 y 2, tal como indican las flechas rojas.

Para controlar cómo se distribuyen las relaciones en un esquema de mashup, realice los siguientes pasos:

El aumento y disminución de la relación se aplica al tamaño completo de cada contenedor de un esquema. En la siguiente figura se muestra el ejemplo de mashup con el mismo aumento y disminución de la relación, con la propiedad flex-basis definida en 0.

Las relaciones se aplican a toda la anchura de cada contenedor y, en este ejemplo, el espacio vacío del esquema se utiliza de forma menos eficaz. En el contenedor 3 se utiliza la mitad del espacio disponible en el esquema. Cada uno de los dos contenedores restantes utiliza una cuarta parte del espacio disponible. Las cotas de los elementos de cada contenedor se desestiman y los contenedores 1 y 2 tienen el mismo tamaño, a pesar del diferente número de widgets de cada uno. Los widgets del contenedor 2 se muestran parcialmente, ya que la relación de 1 que se ha definido no es lo suficientemente ancha para mostrar todos los widgets en la ventana actual.