# List formatting misalignment

**URL:** <https://forum.adalo.com/t/list-formatting-misalignment/19291>\
**Category:** Design\
**Created:** [November 5, 2021, 6:48pm UTC](https://forum.adalo.com/t/list-formatting-misalignment/19291 "2021-11-05T18:48:48Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Trading\_5\_Talents](https://avatars.discourse-cdn.com/v4/letter/t/958977/32.png) [@Trading\_5\_Talents](https://forum.adalo.com/u/Trading_5_Talents)\
**Post date:** [November 5, 2021, 6:48pm UTC](https://forum.adalo.com/t/list-formatting-misalignment/19291/1 "2021-11-05T18:48:48Z")

</div>

Hello! I was wondering if someone can help me understand why my list shows up like this in the preview? The rectangles are all misaligned. Each rectangle should contain custom text for each record via visibility rules. However the rectangles don’t resize to contain all the info. I’ve attached screenshots to show how I’ve set it up. Thanks!

 ![Screen Shot 2021-11-05 at 2.45.10 PM](https://us1.discourse-cdn.com/flex020/uploads/adalo/original/2X/2/291535042fcb4ec034376de8adc59bc6d2747a77.jpeg)  
 ![Screen Shot 2021-11-05 at 2.49.15 PM](https://us1.discourse-cdn.com/flex020/uploads/adalo/original/2X/2/2ad7f0b9ff75482dcc133cfb3cb39f5149fcee4e.jpeg)

---

<div class="post-metadata">

**Author:** ![Dilon](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.adalo.com/dilon/32/39815_2.png) [@Dilon](https://forum.adalo.com/u/Dilon)\
**Post date:** [November 5, 2021, 7:01pm UTC](https://forum.adalo.com/t/list-formatting-misalignment/19291/2 "2021-11-05T19:01:16Z")

</div>

Hi @Trading_5_Talents 👋

Adjust the rectangle Height correctly like this .( Red Line)

![image](https://us1.discourse-cdn.com/flex020/uploads/adalo/original/2X/3/368a200092562c4e4607667ffdbb09a2086d03b8.png)

Thank you

---

<div class="post-metadata">

**Author:** ![Trading\_5\_Talents](https://avatars.discourse-cdn.com/v4/letter/t/958977/32.png) [@Trading\_5\_Talents](https://forum.adalo.com/u/Trading_5_Talents)\
**Post date:** [November 5, 2021, 7:27pm UTC](https://forum.adalo.com/t/list-formatting-misalignment/19291/3 "2021-11-05T19:27:07Z")

</div>

Hmm. I tried adjusting the rectangle (orange handles) but it doesn’t change the layout in the preview. I can’t adjust the red dotted line though.

---

<div class="post-metadata">

**Author:** ![Dilon](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.adalo.com/dilon/32/39815_2.png) [@Dilon](https://forum.adalo.com/u/Dilon)\
**Post date:** [November 5, 2021, 7:28pm UTC](https://forum.adalo.com/t/list-formatting-misalignment/19291/4 "2021-11-05T19:28:01Z")

</div>

When you select the rectangle what you see?

---

<div class="post-metadata">

**Author:** ![Trading\_5\_Talents](https://avatars.discourse-cdn.com/v4/letter/t/958977/32.png) [@Trading\_5\_Talents](https://forum.adalo.com/u/Trading_5_Talents)\
**Post date:** [November 5, 2021, 7:34pm UTC](https://forum.adalo.com/t/list-formatting-misalignment/19291/5 "2021-11-05T19:34:06Z")

</div>

Ah, I got it now. I made the “rectangle” component bigger so that it now includes all custom text components. It works now! Thank you so much!!

 ![Screen Shot 2021-11-05 at 3.34.33 PM](https://us1.discourse-cdn.com/flex020/uploads/adalo/original/2X/c/cc9ec7b00baddca64eaac1dbf317771fd5286999.jpeg)

---

<div class="post-metadata">

**Author:** ![Dilon](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.adalo.com/dilon/32/39815_2.png) [@Dilon](https://forum.adalo.com/u/Dilon)\
**Post date:** [November 5, 2021, 7:35pm UTC](https://forum.adalo.com/t/list-formatting-misalignment/19291/6 "2021-11-05T19:35:06Z")

</div>

Hmm. Happy to hear that and Your welcome

---

<div class="post-metadata">

**Author:** ![geo](https://avatars.discourse-cdn.com/v4/letter/g/f4b2a3/32.png) [@geo](https://forum.adalo.com/u/geo)\
**Post date:** [November 7, 2021, 4:11am UTC](https://forum.adalo.com/t/list-formatting-misalignment/19291/7 "2021-11-07T04:11:58Z")

</div>

Hi! Also having this issue, but my components are already well within the dotted borders. Any advice on what could be wrong here? Images attached of both design, and how it’s showing up in preview (same issue on phone and desktop preview)

Design:

 ![Screen Shot 2021-11-06 at 9.09.08 PM](https://us1.discourse-cdn.com/flex020/uploads/adalo/original/2X/b/b114d7875ce07edd4e24ad8ad8ba0c33cb1707b7.png)

Preview:  
 ![Screen Shot 2021-11-06 at 9.09.29 PM](https://us1.discourse-cdn.com/flex020/uploads/adalo/original/2X/4/419d3012f327368727cfab2c362e39c933c647c6.png)

---

<div class="post-metadata">

**Author:** ![Trading\_5\_Talents](https://avatars.discourse-cdn.com/v4/letter/t/958977/32.png) [@Trading\_5\_Talents](https://forum.adalo.com/u/Trading_5_Talents)\
**Post date:** [November 7, 2021, 12:48pm UTC](https://forum.adalo.com/t/list-formatting-misalignment/19291/8 "2021-11-07T12:48:11Z")

</div>

I had to make the rectangle component big enough to contain all my entries, then it worked.