# Layout distortion

**URL:** https://community.glideapps.com/t/layout-distortion/32167
**Category:** Ask for Help
**Created:** [September 22, 2021, 10:03pm UTC](https://community.glideapps.com/t/layout-distortion/32167 "2021-09-22T22:03:14Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![Alexis\_AZOULAI](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/alexis_azoulai/32/20550_2.png) [@Alexis\_AZOULAI](https://community.glideapps.com/u/Alexis_AZOULAI)
#### Post date: [September 22, 2021, 10:03pm UTC](https://community.glideapps.com/t/layout-distortion/32167/1 "2021-09-22T22:03:15Z")

</div>

Hello everyone,

I made an app to record the results of a tournament and do the ranking.  
When I enter the “detail view” and go back it changes the layout.

Here is the phenomenon in video: [https://youtu.be/\_LdqLt5Ev3M](https://youtu.be/_LdqLt5Ev3M)

The app : [https://verdant-middle-5910.glideapp.io/](https://verdant-middle-5910.glideapp.io/)

In the inline-list screen i have this Rich Text :

> ```auto
> <pre><span><style>
> 
> [data-test="list-item"].separator::after {
> background-color: lightgreen;
> opacity: 0.6;
> height: 3px;
> }
> 
> [data-test="app-hr"] .sep-line {
> background-color: lightgreen;
> opacity: 0.6;
> height: 5px;
> }
> [data-test="list-item"] .textStyle{
> color: Lightgreen;
> Font-size : 20px;
> }
> [data-test="list-item"] .textDetailStyle{
> Font-size : 20px;
> color: white;
> }
> 
> ```

And in the Detail View Screen this one :

> ```auto
> <pre><span><style>
> [data-test="list-item"]> :nth-of-type(1) {
> border: 10px solid lightblue;
> background-color:darkorange;
> height: 180px;
> text-align :center;
> }
> .textContainer,[data-test="list-item-title"]{
> font-size:150px !important;
> }
> [class="sc-biOYSp jYoDhI"] {
> visibility: hidden
> }
> 
> ```

Thank you.

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [September 22, 2021, 11:25pm UTC](https://community.glideapps.com/t/layout-distortion/32167/2 "2021-09-22T23:25:34Z")

</div>

It looks like the code does not load at all, or takes a longer time than the timeout. Do you see this behaviour when viewing in an iOS device?

---

<div class="post-metadata">

### Author: ![Alexis\_AZOULAI](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/alexis_azoulai/32/20550_2.png) [@Alexis\_AZOULAI](https://community.glideapps.com/u/Alexis_AZOULAI)
#### Post date: [September 23, 2021, 9:42pm UTC](https://community.glideapps.com/t/layout-distortion/32167/3 "2021-09-23T21:42:36Z")

</div>

It’s the same phenomenon with Android and with IOS…

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [September 23, 2021, 11:19pm UTC](https://community.glideapps.com/t/layout-distortion/32167/4 "2021-09-23T23:19:10Z")

</div>

Since it’s CSS I don’t think you can send this to support team… Not one where I can help ☹