Merge pull request #5281 from Textualize/fix-grid-offset

fix for grid plus offset

CHANGELOG.md

@@ -5,6 +5,11 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/)
 and this project adheres to [Semantic Versioning](http://semver.org/).
 
+## [0.87.1] - 2024-11-24
+
+## Fixed
+
+- Fixed offset not being applied to grid layout https://github.com/Textualize/textual/pull/5281
 
 ## [0.87.0] - 2024-11-24
 

src/textual/layouts/grid.py

@@ -289,12 +289,16 @@ class GridLayout(Layout):
                 .shrink(margin)
             ) + offset
 
+            widget_styles = widget.styles
             placement_offset = (
-                styles.offset.resolve(cell_size, viewport)
-                if styles.has_rule("offset")
+                widget_styles.offset.resolve(cell_size, viewport)
+                if widget_styles.has_rule("offset")
                 else NULL_OFFSET
             )
 
+            absolute = (
+                widget_styles.has_rule("position") and styles.position == "absolute"
+            )
             add_placement(
                 _WidgetPlacement(
                     region,
@@ -305,7 +309,7 @@ class GridLayout(Layout):
                         else margin.grow_maximum(gutter_spacing)
                     ),
                     widget,
-                    styles.has_rule("position") and styles.position == "absolute",
+                    absolute,
                 )
             )
 

tests/snapshot_tests/test_snapshots.py

@@ -2681,3 +2681,37 @@ def test_position_absolute(snap_compare):
             yield Label("Relative 3", classes="relative offset3")
 
     assert snap_compare(AbsoluteApp())
+
+
+def test_grid_offset(snap_compare):
+    """Regression test for https://github.com/Textualize/textual/issues/5279
+    You should see 6 boxes arranged in a 3x2 grid. The 6th should be offset 10 lines down.
+    """
+
+    class GridOffsetApp(App):
+        CSS = """
+        Screen {
+            layout: grid;
+            grid-size: 3 2;
+        }
+
+        .box {
+            height: 100%;
+            border: solid green;
+        }
+
+        #six {   
+            offset: 0 10;
+            background: blue;
+        }
+        """
+
+        def compose(self) -> ComposeResult:
+            yield Static("One", classes="box")
+            yield Static("Two", classes="box")
+            yield Static("Three", classes="box")
+            yield Static("Four", classes="box")
+            yield Static("Five", classes="box")
+            yield Static("Six", classes="box", id="six")
+
+    assert snap_compare(GridOffsetApp())