diff --git a/packages/smooth_app/lib/pages/product/nutrition_page_loaded.dart b/packages/smooth_app/lib/pages/product/nutrition_page_loaded.dart
index 9bd86c849ae..ecf27b0f183 100644
--- a/packages/smooth_app/lib/pages/product/nutrition_page_loaded.dart
+++ b/packages/smooth_app/lib/pages/product/nutrition_page_loaded.dart
@@ -33,9 +33,13 @@ class _NutritionPageLoadedState extends State<NutritionPageLoaded> {
   // If true then serving, if false then 100g.
   bool _servingOr100g = false;
 
-  static const double _columnSize1 = 250; // TODO(monsieurtanuki): proper size
-  static const double _columnSize2 =
-      100; // TODO(monsieurtanuki): anyway, should fit the largest text, probably 'mcg/µg'
+  double getColumnSizeFromContext(
+    BuildContext context,
+    double adjustmentFactor,
+  ) {
+    final double _columnSize = MediaQuery.of(context).size.width;
+    return _columnSize * adjustmentFactor;
+  }
 
   final Map<String, TextEditingController> _controllers =
       <String, TextEditingController>{};
@@ -74,10 +78,7 @@ class _NutritionPageLoadedState extends State<NutritionPageLoaded> {
       for (final OrderedNutrient orderedNutrient
           in _nutritionContainer.getDisplayableNutrients()) {
         children.add(
-          _getNutrientRow(
-            appLocalizations,
-            orderedNutrient,
-          ),
+          _getNutrientRow(appLocalizations, orderedNutrient),
         );
       }
       children.add(_addNutrientButton(appLocalizations));
@@ -108,7 +109,7 @@ class _NutritionPageLoadedState extends State<NutritionPageLoaded> {
         crossAxisAlignment: CrossAxisAlignment.center,
         children: <Widget>[
           SizedBox(
-            width: _columnSize1,
+            width: getColumnSizeFromContext(context, 0.6),
             child: _getNutrientCell(
               appLocalizations,
               orderedNutrient,
@@ -116,7 +117,7 @@ class _NutritionPageLoadedState extends State<NutritionPageLoaded> {
             ),
           ),
           SizedBox(
-            width: _columnSize2,
+            width: getColumnSizeFromContext(context, 0.3),
             child: _getUnitCell(orderedNutrient),
           ),
         ],
@@ -232,7 +233,7 @@ class _NutritionPageLoadedState extends State<NutritionPageLoaded> {
       Container(
         color: Theme.of(context).colorScheme.primary,
         child: Row(
-          mainAxisAlignment: MainAxisAlignment.end,
+          mainAxisAlignment: MainAxisAlignment.spaceBetween,
           crossAxisAlignment: CrossAxisAlignment.center,
           children: <Widget>[
             Switch(
@@ -241,7 +242,7 @@ class _NutritionPageLoadedState extends State<NutritionPageLoaded> {
                   setState(() => _unspecified = !_unspecified),
             ),
             SizedBox(
-              width: 300, // TODO(monsieurtanuki): proper size
+              width: getColumnSizeFromContext(context, 0.6),
               child: Text(
                 appLocalizations.nutrition_page_unspecified,
                 style: const TextStyle(color: Colors.white),