diff --git a/Libraries/LibWeb/Layout/FormattingContext.cpp b/Libraries/LibWeb/Layout/FormattingContext.cpp
index 95e574dee53..37bdf7d584d 100644
--- a/Libraries/LibWeb/Layout/FormattingContext.cpp
+++ b/Libraries/LibWeb/Layout/FormattingContext.cpp
@@ -1439,6 +1439,10 @@ CSSPixels FormattingContext::calculate_fit_content_height(Layout::Box const& box
 
 CSSPixels FormattingContext::calculate_min_content_width(Layout::Box const& box) const
 {
+    if (box.is_replaced_box() && box.computed_values().width().is_percentage()) {
+        return 0;
+    }
+
     if (box.has_natural_width())
         return *box.natural_width();
 
@@ -1594,8 +1598,12 @@ CSSPixels FormattingContext::calculate_inner_width(Layout::Box const& box, Avail
     return width.to_px(box, width_of_containing_block);
 }
 
-CSSPixels FormattingContext::calculate_inner_height(Layout::Box const& box, AvailableSpace const& available_space, CSS::Size const& height) const
+CSSPixels FormattingContext::calculate_inner_height(Box const& box, AvailableSpace const& available_space, CSS::Size const& height) const
 {
+    if (height.is_auto() && box.has_preferred_aspect_ratio()) {
+        return m_state.get(box).content_width() / *box.preferred_aspect_ratio();
+    }
+
     VERIFY(!height.is_auto());
 
     if (height.is_fit_content()) {
@@ -1701,8 +1709,12 @@ bool FormattingContext::should_treat_width_as_auto(Box const& box, AvailableSpac
 bool FormattingContext::should_treat_height_as_auto(Box const& box, AvailableSpace const& available_space) const
 {
     auto computed_height = box.computed_values().height();
-    if (computed_height.is_auto())
+    if (computed_height.is_auto()) {
+        auto const& box_state = m_state.get(box);
+        if (box_state.has_definite_width() && box.has_preferred_aspect_ratio())
+            return false;
         return true;
+    }
 
     if (computed_height.contains_percentage()) {
         if (available_space.height.is_max_content())
diff --git a/Libraries/LibWeb/Layout/FormattingContext.h b/Libraries/LibWeb/Layout/FormattingContext.h
index 3d47f2c950d..d01e35e46fb 100644
--- a/Libraries/LibWeb/Layout/FormattingContext.h
+++ b/Libraries/LibWeb/Layout/FormattingContext.h
@@ -76,7 +76,7 @@ public:
     CSSPixels calculate_fit_content_width(Layout::Box const&, AvailableSpace const&) const;
 
     CSSPixels calculate_inner_width(Layout::Box const&, AvailableSize const&, CSS::Size const& width) const;
-    [[nodiscard]] CSSPixels calculate_inner_height(Layout::Box const&, AvailableSpace const&, CSS::Size const& height) const;
+    [[nodiscard]] CSSPixels calculate_inner_height(Box const&, AvailableSpace const&, CSS::Size const& height) const;
 
     virtual CSSPixels greatest_child_width(Box const&) const;
 
diff --git a/Libraries/LibWeb/Layout/GridFormattingContext.cpp b/Libraries/LibWeb/Layout/GridFormattingContext.cpp
index aaa9955d2f3..fd231868507 100644
--- a/Libraries/LibWeb/Layout/GridFormattingContext.cpp
+++ b/Libraries/LibWeb/Layout/GridFormattingContext.cpp
@@ -2438,6 +2438,9 @@ CSSPixels GridFormattingContext::calculate_min_content_contribution(GridItem con
     }
 
     auto preferred_size = get_item_preferred_size(item, dimension);
+    if (dimension == GridDimension::Row && preferred_size.is_auto() && item.box->has_preferred_aspect_ratio()) {
+        return m_state.get(item.box).content_width() / item.box->preferred_aspect_ratio().value();
+    }
     auto containing_block_size = containing_block_size_for_item(item, dimension);
     auto result = item.add_margin_box_sizes(preferred_size.to_px(grid_container(), containing_block_size), dimension);
     return min(result, maxium_size);
diff --git a/Tests/LibWeb/Layout/expected/grid/image-with-percentage-width-and-auto-height.txt b/Tests/LibWeb/Layout/expected/grid/image-with-percentage-width-and-auto-height.txt
new file mode 100644
index 00000000000..0249fb1250d
--- /dev/null
+++ b/Tests/LibWeb/Layout/expected/grid/image-with-percentage-width-and-auto-height.txt
@@ -0,0 +1,15 @@
+Viewport <#document> at (0,0) content-size 800x600 children: not-inline
+  BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
+    BlockContainer <body> at (8,8) content-size 784x50 children: not-inline
+      Box <div#item> at (8,8) content-size 100x50 [GFC] children: not-inline
+        BlockContainer <(anonymous)> (not painted) [BFC] children: inline
+          TextNode <#text>
+        ImageBox <img> at (8,8) content-size 50x50 children: not-inline
+        BlockContainer <(anonymous)> (not painted) [BFC] children: inline
+          TextNode <#text>
+
+ViewportPaintable (Viewport<#document>) [0,0 800x600]
+  PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
+    PaintableWithLines (BlockContainer<BODY>) [8,8 784x50]
+      PaintableBox (Box<DIV>#item) [8,8 100x50]
+        ImagePaintable (ImageBox<IMG>) [8,8 50x50]
diff --git a/Tests/LibWeb/Layout/expected/inline-flex-with-aspect-ratio.txt b/Tests/LibWeb/Layout/expected/inline-flex-with-aspect-ratio.txt
index 5c401ed1dda..d8c860191e2 100644
--- a/Tests/LibWeb/Layout/expected/inline-flex-with-aspect-ratio.txt
+++ b/Tests/LibWeb/Layout/expected/inline-flex-with-aspect-ratio.txt
@@ -1,15 +1,15 @@
 Viewport <#document> at (0,0) content-size 800x600 children: not-inline
   BlockContainer <html> at (0,0) content-size 800x33 [BFC] children: not-inline
     BlockContainer <body> at (8,8) content-size 784x17 children: inline
-      frag 0 from Box start: 0, length: 0, rect: [8,11 10x10.3125] baseline: 9.953125
-      Box <div.inline-flex.aspect-ratio> at (8,11) content-size 10x10.3125 flex-container(row) [FFC] children: not-inline
-        BlockContainer <div.img-wrapper> at (8,7.65625) content-size 10x17 flex-item [BFC] children: inline
-          frag 0 from ImageBox start: 0, length: 0, rect: [8,10.65625 10x10] baseline: 10
-          ImageBox <img> at (8,10.65625) content-size 10x10 children: not-inline
+      frag 0 from Box start: 0, length: 0, rect: [8,8 10x10.3125] baseline: 13.296875
+      Box <div.inline-flex.aspect-ratio> at (8,8) content-size 10x10.3125 flex-container(row) [FFC] children: not-inline
+        BlockContainer <div.img-wrapper> at (8,8) content-size 10x10.3125 flex-item [BFC] children: inline
+          frag 0 from ImageBox start: 0, length: 0, rect: [8,11 10x10] baseline: 10
+          ImageBox <img> at (8,11) content-size 10x10 children: not-inline
 
 ViewportPaintable (Viewport<#document>) [0,0 800x600]
   PaintableWithLines (BlockContainer<HTML>) [0,0 800x33]
     PaintableWithLines (BlockContainer<BODY>) [8,8 784x17]
-      PaintableBox (Box<DIV>.inline-flex.aspect-ratio) [8,11 10x10.3125] overflow: [8,7.65625 10x17]
-        PaintableWithLines (BlockContainer<DIV>.img-wrapper) [8,7.65625 10x17]
-          ImagePaintable (ImageBox<IMG>) [8,10.65625 10x10]
+      PaintableBox (Box<DIV>.inline-flex.aspect-ratio) [8,8 10x10.3125] overflow: [8,8 10x13]
+        PaintableWithLines (BlockContainer<DIV>.img-wrapper) [8,8 10x10.3125] overflow: [8,8 10x13]
+          ImagePaintable (ImageBox<IMG>) [8,11 10x10]
diff --git a/Tests/LibWeb/Layout/input/grid/image-with-percentage-width-and-auto-height.html b/Tests/LibWeb/Layout/input/grid/image-with-percentage-width-and-auto-height.html
new file mode 100644
index 00000000000..6277793394d
--- /dev/null
+++ b/Tests/LibWeb/Layout/input/grid/image-with-percentage-width-and-auto-height.html
@@ -0,0 +1,14 @@
+<style>
+    #item {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        width: 100px;
+        outline: 1px solid black;
+    }
+    img {
+        width: 100%;
+    }
+</style>
+<div id="item">
+    <img src="../../../Assets/120.png">
+</div>
\ No newline at end of file