# How to shifting method position progress bar type half circle

**URL:** https://community.glideapps.com/t/how-to-shifting-method-position-progress-bar-type-half-circle/42330
**Category:** Ask for Help
**Created:** [May 24, 2022, 3:13pm UTC](https://community.glideapps.com/t/how-to-shifting-method-position-progress-bar-type-half-circle/42330 "2022-05-24T15:13:47Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![l3oy8231](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/l3oy8231/32/32303_2.png) [@l3oy8231](https://community.glideapps.com/u/l3oy8231)
#### Post date: [May 24, 2022, 3:13pm UTC](https://community.glideapps.com/t/how-to-shifting-method-position-progress-bar-type-half-circle/42330/1 "2022-05-24T15:13:47Z")

</div>

Advice on how to use css code

My problem is it’s not centered. and display an error on the device.

thanks for the help 🙏 🙏

 ![1653405154436](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/7/c/7c804f51e4f9ce40d8e9e3193e5b13ec3ab6f8af.jpeg)

![1653405138233](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/9/9/99c53c784c84aa2279a20ec9c0219b0b6eb2631d.jpeg)

```auto
<pre><span><style>

div[id*='screenScrollView'] > div > :nth-child(3) {
display:fixed;
width:160px;
top: -20px; 
left: -5px;
margin-top:5px;
-webkit-transform: scale(0.7);
margin-left: calc(40% - 125px);
}

div[id*='screenScrollView'] > div > :nth-child(4) {
display:fixed;
margin-top:-225px;
left:55px;
width:auto;
-webkit-transform: scale(0.7);
margin-left: calc(50% - 125px);
}

```

---

<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: [May 25, 2022, 12:24am UTC](https://community.glideapps.com/t/how-to-shifting-method-position-progress-bar-type-half-circle/42330/2 "2022-05-25T00:24:40Z")

</div>

So you want two charts on the same line and they must be aligned center? By center, do you mean those two should be close to each other at the center of the screen or do you want each of them to be under the “information” and “contract” text?

Either way, it’s difficult. You would have a hard time figuring out the right combination for all those px settings to make it work on every device.

---

<div class="post-metadata">

### Author: ![l3oy8231](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/l3oy8231/32/32303_2.png) [@l3oy8231](https://community.glideapps.com/u/l3oy8231)
#### Post date: [May 25, 2022, 1:43am UTC](https://community.glideapps.com/t/how-to-shifting-method-position-progress-bar-type-half-circle/42330/3 "2022-05-25T01:43:03Z")

</div>

yes i want this be under the “information” and “contract” text

I’m wondering why in PUBLISH App the results are not matching. 😭 😭

![1653442874579](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/6/4/64f22f4d61a20e8692cad1b33d47ed7e72f9616b.jpeg)

 ![690769](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/3/a/3a05a1f2bb2b42e67a54ac215a660fb6feea187e.jpeg)

⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠⚠

Edit: I tried adjusting it again and it seemed to show the correct result. and displayed on the device as the developer screen.

```auto
<pre><span><style>

div[id*='screenScrollView'] > div > :nth-child(3) {
display:fixed;
width:auto;
margin-left:-180px;
-webkit-transform: scale(0.7);
}

div[id*='screenScrollView'] > div > :nth-child(4) {
display:fixed;
margin-top:-205px;
margin-left:180px;
width:auto;
-webkit-transform: scale(0.7);
}

```

 ![690771](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/0/0/00033183d86c6d1d1ab8e22f204e4d27ae40d71b.jpeg)

 ![1653444378524](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/c/a/cabe9c0e31b3c5fc88d83b87af31d47a01432316.jpeg)

---

<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: [May 25, 2022, 3:20am UTC](https://community.glideapps.com/t/how-to-shifting-method-position-progress-bar-type-half-circle/42330/4 "2022-05-25T03:20:22Z")

</div>

So it’s working now? Good to hear!

---

<div class="post-metadata">

### Author: ![l3oy8231](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/l3oy8231/32/32303_2.png) [@l3oy8231](https://community.glideapps.com/u/l3oy8231)
#### Post date: [May 25, 2022, 3:54am UTC](https://community.glideapps.com/t/how-to-shifting-method-position-progress-bar-type-half-circle/42330/5 "2022-05-25T03:54:33Z")

</div>

yes!! enough to show the desired effect. I tried adjusting the values based on the sample Css code shared in the community.

🙏 🙏 🙏

---

<div class="post-metadata">

### Author: ![system](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/system/32/53398_2.png) [@system](https://community.glideapps.com/u/system)
#### Post date: [May 26, 2022, 3:54am UTC](https://community.glideapps.com/t/how-to-shifting-method-position-progress-bar-type-half-circle/42330/6 "2022-05-26T03:54:40Z")

</div>

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.