---
source: crates/biome_formatter_test/src/snapshot_builder.rs
info: css/postcss-plugins/postcss-nested.css
---

# Input

```css
.phone {
    &_title {
        width: 500px;
        @media (max-width: 500px) {
            width: auto;
        }
        body.is_dark & {
            color: white;
        }
    }
    img {
        display: block;
    }
}

```


# Prettier differences

```diff
--- Prettier
+++ Biome
@@ -1,14 +1,14 @@
 .phone {
-  &_title {
-    width: 500px;
-    @media (max-width: 500px) {
-      width: auto;
+    &_title {
+        width: 500px;
+        @media (max-width: 500px) {
+            width: auto;
+        }
+        body.is_dark & {
+            color: white;
+        }
     }
-    body.is_dark & {
-      color: white;
+    img {
+        display: block;
     }
-  }
-  img {
-    display: block;
-  }
 }
```

# Output

```css
.phone {
    &_title {
        width: 500px;
        @media (max-width: 500px) {
            width: auto;
        }
        body.is_dark & {
            color: white;
        }
    }
    img {
        display: block;
    }
}
```

# Errors
```
postcss-nested.css:5:24 parse ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  × expected `,` but instead found `;`
  
    3 │         width: 500px;
    4 │         @media (max-width: 500px) {
  > 5 │             width: auto;
      │                        ^
    6 │         }
    7 │         body.is_dark & {
  
  i Remove ;
  
postcss-nested.css:15:1 parse ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  × expected `}` but instead the file ends
  
    13 │     }
    14 │ }
  > 15 │ 
       │ 
  
  i the file ends here
  
    13 │     }
    14 │ }
  > 15 │ 
       │ 
  

```