fix border issue (#2074)

* fix border issue

* add PR to changelog

CHANGELOG.md

@@ -11,7 +11,9 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 
 - Dropped "loading-indicator--dot" component style from LoadingIndicator https://github.com/Textualize/textual/pull/2050
 
-## Unreleased
+### Fixed
+
+- Fixed borders not rendering correctly. https://github.com/Textualize/textual/pull/2074
 
 ### Changed
 

src/textual/dom.py

@@ -609,9 +609,8 @@ class DOMNode(MessagePump):
         base_background = background = BLACK
         for node in reversed(self.ancestors_with_self):
             styles = node.styles
-            if styles.has_rule("background"):
-                base_background = background
-                background += styles.background
+            base_background = background
+            background += styles.background
         return (base_background, background)
 
     @property
@@ -621,9 +620,8 @@ class DOMNode(MessagePump):
         base_color = color = BLACK
         for node in reversed(self.ancestors_with_self):
             styles = node.styles
-            if styles.has_rule("background"):
-                base_background = background
-                background += styles.background
+            base_background = background
+            background += styles.background
             if styles.has_rule("color"):
                 base_color = color
                 if styles.auto_color:

tests/snapshot_tests/snapshot_apps/border_alpha.py

@@ -1,43 +1,40 @@
 from textual.app import App, ComposeResult
-from textual.containers import Grid
-from textual.widget import Widget
+from textual.containers import Vertical
+from textual.widgets import Label
+
 
 class BorderAlphaApp(App[None]):
-
-    CSS = """
-    Grid {
-        height: 100%;
+    CSS = """   
+    .boxes {
+        height: 3;
         width: 100%;
-        grid-size: 2 2;
     }
-
-    #b00 { border: 0%; }
-    #b01 { border: 33%; }
-    #b02 { border: 66%; }
-    #b03 { border: 100%; }
-
-    #b10 { border: solid 0%; }
-    #b11 { border: dashed 33%; }
-    #b12 { border: round 66%; }
-    #b13 { border: ascii 100%; }
-
-    #b20 { border: 0% red; }
-    #b21 { border: 33% orange; }
-    #b22 { border: 66% green; }
-    #b23 { border: 100% blue; }
-
-    #b30 { border: solid 0% red; }
-    #b31 { border: dashed 33% orange; }
-    #b32 { border: round 66% green; }
-    #b33 { border: ascii 100% blue; }
+    
+    #box0 {
+        border: heavy green 0%;
+    }
+    #box1 {
+        border: heavy green 20%;
+    }
+    #box2 {
+        border: heavy green 40%;
+    }
+    #box3 {
+        border: heavy green 60%;
+    }
+    #box4 {
+        border: heavy green 80%;
+    }
+    #box5 {
+        border: heavy green 100%;
+    }        
     """
 
-    def compose( self ) -> ComposeResult:
-        with Grid():
-            for outer in range(4):
-                with Grid():
-                    for inner in range(4):
-                        yield Widget(id=f"b{outer}{inner}")
+    def compose(self) -> ComposeResult:
+        with Vertical():
+            for box in range(6):
+                yield Label(id=f"box{box}", classes="boxes")
+
 
 if __name__ == "__main__":
     BorderAlphaApp().run()