# List not scaling properly

**URL:** <https://forum.codewithmosh.com/t/list-not-scaling-properly/3083>\
**Category:** HTML/CSS\
**Created:** [March 1, 2021, 8:02am UTC](https://forum.codewithmosh.com/t/list-not-scaling-properly/3083 "2021-03-01T08:02:54Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![GreenArrow](https://avatars.discourse-cdn.com/v4/letter/g/2acd7d/32.png) [@GreenArrow](https://forum.codewithmosh.com/u/GreenArrow)\
**Post date:** [March 1, 2021, 8:02am UTC](https://forum.codewithmosh.com/t/list-not-scaling-properly/3083/1 "2021-03-01T08:02:54Z")

</div>

Hello guys. In HTML & CSS series, anyone knows how to solve this? Around 768px to 1020px screen, the badge is not fitting into the grid. I have done exactly what Mosh did, yet this does still happen.

![image](https://us1.discourse-cdn.com/flex020/uploads/codewithmosh/original/2X/4/43833bd8024fb96342b215d1b0eb9257a7c95bcf.png)

These are the codes:  
.block-domain .input-group {  
box-shadow: 0 0 30px 20px #e6ebee;  
border: 0;  
margin: 4rem auto;  
max-width: 670px;  
}

```
.block-domain__prices {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, 6rem);
  font-size: 2rem;
  font-weight: 600;
  justify-items: center;
  max-width: 700px;
  margin: 0 auto;
}

@media screen and (min-width: 768px) {
  .block-domain__prices {
grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  }
}
```

---

<div class="post-metadata">

**Author:** ![SAM](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.codewithmosh.com/sam/32/167_2.png) [@SAM](https://forum.codewithmosh.com/u/SAM)\
**Post date:** [March 1, 2021, 8:31am UTC](https://forum.codewithmosh.com/t/list-not-scaling-properly/3083/2 "2021-03-01T08:31:57Z")

</div>

Do you have `white-space: nowrap;` in your `.badge` class?

---

<div class="post-metadata">

**Author:** ![GreenArrow](https://avatars.discourse-cdn.com/v4/letter/g/2acd7d/32.png) [@GreenArrow](https://forum.codewithmosh.com/u/GreenArrow)\
**Post date:** [March 1, 2021, 8:33am UTC](https://forum.codewithmosh.com/t/list-not-scaling-properly/3083/3 "2021-03-01T08:33:52Z")

</div>

ow. Thanks. I actualy have nowarp in my .bagde class but I mistyped it to “no-wrap”.