# How to align the text of a circular button? **URL:** \ **Category:** Questions about Thunkable X\ **Tags:** design, beginner, button, help, text\ **Created:** [February 8, 2021, 3:21am UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266 "2021-02-08T03:21:36Z")\ **Posts on this page:** 12\ **Page:** 1
**Author:** ![mdalahi2007xv](https://avatars.discourse-cdn.com/v4/letter/m/d07c76/32.png) [@mdalahi2007xv](https://community.thunkable.com/u/mdalahi2007xv)\ **Post date:** [February 8, 2021, 3:21am UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/1 "2021-02-08T03:21:37Z")
I created a circular button with the help of a Thunkable Community Post. After I have created the button, the text alignment of the button is top. I can’t change it to center. Please Help. > [@Creating a Circular Button](https://community.thunkable.com/t/creating-a-circular-button/74560): > > Buttons, by default, are rectangular but with just a few minor adjustments you can transform them into circles to completely change the look and feel of your app. Properties To achieve this effect, you’ll need to change the width, the height and, most importantly the borderRadius of your button. It’s worth pointing out that several other components such as the label and the TextInput also have a border radius property. Squares Start by setting the width and the height to the… ---
**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\ **Post date:** [February 8, 2021, 5:26am UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/2 "2021-02-08T05:26:07Z")
This is a known issue: [Button font size changes vertical alignment · Issue #778 · thunkable/thunkable-issues · GitHub](https://github.com/thunkable/thunkable-issues/issues/778) I suggest you comment on the GitHub post so that it gets more traction. ---
**Author:** ![Deluxe](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/deluxe/32/30016_2.png) [@Deluxe](https://community.thunkable.com/u/Deluxe)\ **Post date:** [February 8, 2021, 5:47am UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/3 "2021-02-08T05:47:28Z")
Interesting. I follow the steps to reproduce the issue as described on GitHub but the text is aligned vertically in the center of the button on both my iOS and Android devices despite the Thunkable Editor showing it at the top of the button. Both width and height are set to “Fit contents”. @mdalahi2007xv can you share your button settings? ---
**Author:** ![mdalahi2007xv](https://avatars.discourse-cdn.com/v4/letter/m/d07c76/32.png) [@mdalahi2007xv](https://community.thunkable.com/u/mdalahi2007xv)\ **Post date:** [February 8, 2021, 7:15am UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/4 "2021-02-08T07:15:39Z")
Thank you so much. ---
**Author:** ![mdalahi2007xv](https://avatars.discourse-cdn.com/v4/letter/m/d07c76/32.png) [@mdalahi2007xv](https://community.thunkable.com/u/mdalahi2007xv)\ **Post date:** [February 8, 2021, 7:24am UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/5 "2021-02-08T07:24:18Z")
Sure! Here are the screenshots of the button settings. You can also check it out here- [Thunkable](https://x.thunkable.com/copy/04836f47e953188e147b7e61baa4007c) ![Thunkable - Google Chrome 2_8_2021 1_17_36 PM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/b/b/bbaf836d5b21cb2e3618ab369e6822c5560eac33.png) ![Thunkable - Google Chrome 2_8_2021 1_18_02 PM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/7/e/7e867cfab5275449965998b0d69f63030096f804.png) ![Thunkable - Google Chrome 2_8_2021 1_17_16 PM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/f/d/fddbaff6cd7d19cbb57042b2e2973491f53ae814.png) ---
**Author:** ![mdalahi2007xv](https://avatars.discourse-cdn.com/v4/letter/m/d07c76/32.png) [@mdalahi2007xv](https://community.thunkable.com/u/mdalahi2007xv)\ **Post date:** [February 8, 2021, 7:24am UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/6 "2021-02-08T07:24:56Z")
![Thunkable - Google Chrome 2_8_2021 1_18_13 PM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/8/8/88e225dcc8085b14f93676613b9b76d155da0c92.png) ---
**Author:** ![codeswept](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/codeswept/32/87755_2.png) [@codeswept](https://community.thunkable.com/u/codeswept)\ **Post date:** [February 8, 2021, 7:38am UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/7 "2021-02-08T07:38:56Z")
@mdalahi2007xv it will seems vertical on the Thunkable editor, but it is center-aligned during web test and live test. Could you check? ---
**Author:** ![Deluxe](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/deluxe/32/30016_2.png) [@Deluxe](https://community.thunkable.com/u/Deluxe)\ **Post date:** [February 8, 2021, 10:23am UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/8 "2021-02-08T10:23:19Z")
Exactly. Always check on the device. Never trust what you see in the designer or in the web version of your app. That is why i said > [@Deluxe](#): > > despite the Thunkable Editor showing it at the top of the button in my earlier message. ---
**Author:** ![ioannisroungeris](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannisroungeris/32/109459_2.png) [@ioannisroungeris](https://community.thunkable.com/u/ioannisroungeris)\ **Post date:** [February 16, 2022, 12:22pm UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/9 "2022-02-16T12:22:30Z")
Hello I am facing the same issue I have created this app [OneLink.To](https://onelink.to/9fry5c) But the last few days the appearance of the buttons has changed without changing the setting on the thunkable platform. As you can see, on thunkable all the numbers look in the middle of the button and the same is happening also on the live test. But when I build it and download the app the numbers are going lower in the button. (You can check also the appearance on your own device by downloading the app from the link above) what I can change in button’s settings to fix it, please help ![Στιγμιότυπο οθόνης (503)](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/8/5/855cf1ac9818099a4865f14ae2f28e911b47c2e5.png) ![IMG_20220216_125455_373](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/2/e/2e8ed52a22c20f0565502a91e804d6a67bd03c5b.jpeg) ![Screenshot_20220216-125357_One Tap Calculator](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/b/6/b614bc578f0ecf9c3d31d56ba19f78f944d73067.jpeg) ---
**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\ **Post date:** [February 16, 2022, 2:54pm UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/10 "2022-02-16T14:54:28Z")
Hey @ioannisroungeris , Can you share a project link with me via DM, i tried to recreate this issue this morning here [Thunkable](https://x.thunkable.com/projectPage/620bee909e6d820010df24af) and couldn’t make it happen ---
**Author:** ![ioannisroungeris](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannisroungeris/32/109459_2.png) [@ioannisroungeris](https://community.thunkable.com/u/ioannisroungeris)\ **Post date:** [February 16, 2022, 2:56pm UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/11 "2022-02-16T14:56:33Z")
Yes, thanks ---
**Author:** ![ioannis](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/ioannis/32/146956_2.png) [@ioannis](https://community.thunkable.com/u/ioannis)\ **Post date:** [November 8, 2024, 1:29pm UTC](https://community.thunkable.com/t/how-to-align-the-text-of-a-circular-button/1086266/12 "2024-11-08T13:29:31Z")