Notice: The Monaca & Onsen UI Community Forum is shutting down.
For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.
Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.
Cant center ons-list-item text in Android
-
Hi, I’m having a problem centering text inside an ons-list-item in Android. I’m trying to do this with the <div class=“center”>, but it just wont work. I was able to center it using ons-column, but this dissables the tappable effect I wanted to assing to the ons-list-item. As far as i’ve seen, this also affects the web view, and I’m seeing this bug even in Onsen’s sample page:
https://onsen.io/v2/api/js/ons-list-item.html#modifiers
(The lists title shows perfectly under ios, but left-aligned on android’s view).I saw this thread
https://community.onsen.io/topic/1115/centre-title-in-android/2
where Fran Diox recommends assigning the css manually with text-align: center, but this isn’t working for me either. Is there any solution to center the text in Android, or assign the tappable effect to an ons-column?Thanks!
-
@rogerroger Check this out and let me know if it doesn’t work:
-
Thanks for the suggestion. I tried it and it doesn’t work. Apparently, being inside an <ons-list-item tappable> tag breaks the alignment. I tried to add it in the codepen and it also missalings the text.
-
@rogerroger Fixed it. I didn’t realize you needed it in the list.
-
Thank you for your help @munsterlander, the “width: 100%” trick solved the issue!