Title: Feature Request: Span supporting alignment · Issue #4795 · NativeScript/NativeScript · GitHub
Open Graph Title: Feature Request: Span supporting alignment · Issue #4795 · NativeScript/NativeScript
X Title: Feature Request: Span supporting alignment · Issue #4795 · NativeScript/NativeScript
Description: Please, provide the details below: Did you verify this is a real problem by searching Stack Overflow and the other open issues in this repo? Yes Tell us about the problem Please, ensure your title is less than 63 characters long and star...
Open Graph Description: Please, provide the details below: Did you verify this is a real problem by searching Stack Overflow and the other open issues in this repo? Yes Tell us about the problem Please, ensure your title ...
X Description: Please, provide the details below: Did you verify this is a real problem by searching Stack Overflow and the other open issues in this repo? Yes Tell us about the problem Please, ensure your title ...
Opengraph URL: https://github.com/NativeScript/NativeScript/issues/4795
X: @github
Domain: github.com
{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"Feature Request: Span supporting alignment","articleBody":"## Please, provide the details below:\r\n\r\n### Did you verify this is a real problem by searching [Stack Overflow](http://stackoverflow.com/questions/tagged/nativescript) and the [other open issues in this repo](https://github.com/NativeScript/nativescript/issues)?\r\n\r\nYes\r\n\r\n### Tell us about the problem\r\nPlease, ensure your title is less than 63 characters long and starts with a capital\r\nletter.\r\n\r\n### Which platform(s) does your issue occur on?\r\n\r\nAndroid -- confirmed\r\n\r\n### Please provide the following version numbers that your issue occurs with:\r\nLasted CLI, runtime, core-modules\r\n\r\n### Please tell us how to recreate the issue in as much detail as possible.\r\n\r\n``` XML\r\n\u003cButton row=\"3\" col=\"1\" class=\"action-button\" tap=\"{{ $parents['ListView'].onReplyTap }}\"\u003e\r\n \u003cFormattedString\u003e\r\n \u003cSpan text=\"\u0026#xE0CB; \" class=\"mdi\"\u003e\u003c/Span\u003e\r\n \u003cSpan text=\"{{ reply_count }}\"\u003e\u003c/Span\u003e\r\n \u003c/FormattedString\u003e\r\n\u003c/Button\u003e\r\n```\r\n\r\nGiven the above layout, using spans for positioning a font icon next to the text inside a button. It would be nice to have a way to shift the alignment of the span. The font icon is slightly offset vertically compared to the string text. I've looked through the `span` source and seen the limited list of styling props available. If this isn't simply achievable, maybe an explanation on the limitation so the documentation can be improved in this area as well. I'm sure I can't be the only one who's tried this approach and noticed it 😄 so if there are limitations at least having it documented for new NS devs would be nice 👍 look forward to hearing more info. Thanks as always 🤗 \r\n\r\nBelow is screen demonstrating the offset:\r\n\u003cimg width=\"411\" alt=\"offsetspan\" src=\"https://user-images.githubusercontent.com/6006148/30045445-03da57a8-91ca-11e7-82bd-422b6170517a.png\"\u003e\r\n\r\n\r\n\u003cbountysource-plugin\u003e\r\n\r\n---\r\nWant to back this issue? **[Post a bounty on it!](https://www.bountysource.com/issues/48986815-feature-request-span-supporting-alignment?utm_campaign=plugin\u0026utm_content=tracker%2F12908224\u0026utm_medium=issues\u0026utm_source=github)** We accept bounties via [Bountysource](https://www.bountysource.com/?utm_campaign=plugin\u0026utm_content=tracker%2F12908224\u0026utm_medium=issues\u0026utm_source=github).\r\n\u003c/bountysource-plugin\u003e","author":{"url":"https://github.com/bradmartin","@type":"Person","name":"bradmartin"},"datePublished":"2017-09-05T04:36:25.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":41},"url":"https://github.com/4795/NativeScript/issues/4795"}
| route-pattern | /_view_fragments/issues/show/:user_id/:repository/:id/issue_layout(.:format) |
| route-controller | voltron_issues_fragments |
| route-action | issue_layout |
| fetch-nonce | v2:ed783148-d1b0-92bb-afb6-91c4a2090bad |
| current-catalog-service-hash | 81bb79d38c15960b92d99bca9288a9108c7a47b18f2423d0f6438c5b7bcd2114 |
| request-id | B8E8:173B9C:980F89:C527CE:6A600648 |
| html-safe-nonce | daca6a3a1d038debe6c5e7e8f00bd254bce289e090cffac1cfbc3f628caf2454 |
| visitor-payload | eyJyZWZlcnJlciI6IiIsInJlcXVlc3RfaWQiOiJCOEU4OjE3M0I5Qzo5ODBGODk6QzUyN0NFOjZBNjAwNjQ4IiwidmlzaXRvcl9pZCI6IjU5ODIyMDEzMjY5MjczNDkzMjAiLCJyZWdpb25fZWRnZSI6ImlhZCIsInJlZ2lvbl9yZW5kZXIiOiJpYWQifQ== |
| visitor-hmac | eb8816c4a00c31aee36f4e134e3d7ed633258ad34673ccee4dc1f5b62d9d1152 |
| hovercard-subject-tag | issue:255158055 |
| github-keyboard-shortcuts | repository,issues,copilot |
| google-site-verification | Apib7-x98H0j5cPqHWwSMm6dNU4GmODRoqxLiDzdx9I |
| octolytics-url | https://collector.github.com/github/collect |
| analytics-location | / |
| fb:app_id | 1401488693436528 |
| apple-itunes-app | app-id=1477376905, app-argument=https://github.com/_view_fragments/issues/show/NativeScript/NativeScript/4795/issue_layout |
| twitter:image | https://opengraph.githubassets.com/635238c9f5a54e2fc7d1974d71f48c052eff1a299ebab23f6ca9157244145a3f/NativeScript/NativeScript/issues/4795 |
| twitter:card | summary_large_image |
| og:image | https://opengraph.githubassets.com/635238c9f5a54e2fc7d1974d71f48c052eff1a299ebab23f6ca9157244145a3f/NativeScript/NativeScript/issues/4795 |
| og:image:alt | Please, provide the details below: Did you verify this is a real problem by searching Stack Overflow and the other open issues in this repo? Yes Tell us about the problem Please, ensure your title ... |
| og:image:width | 1200 |
| og:image:height | 600 |
| og:site_name | GitHub |
| og:type | object |
| og:author:username | bradmartin |
| hostname | github.com |
| expected-hostname | github.com |
| None | 5789899e92b20db289de946d86eb20bf5c9626276695d68f58a8c47cdda699b7 |
| turbo-cache-control | no-preview |
| go-import | github.com/NativeScript/NativeScript git https://github.com/NativeScript/NativeScript.git |
| octolytics-dimension-user_id | 7392261 |
| octolytics-dimension-user_login | NativeScript |
| octolytics-dimension-repository_id | 31492490 |
| octolytics-dimension-repository_nwo | NativeScript/NativeScript |
| octolytics-dimension-repository_public | true |
| octolytics-dimension-repository_is_fork | false |
| octolytics-dimension-repository_network_root_id | 31492490 |
| octolytics-dimension-repository_network_root_nwo | NativeScript/NativeScript |
| turbo-body-classes | logged-out env-production page-responsive |
| disable-turbo | false |
| browser-stats-url | https://api.github.com/_private/browser/stats |
| browser-errors-url | https://api.github.com/_private/browser/errors |
| release | 6ddc048ddf80664b9b33547b619db10313c482f1 |
| ui-target | canary-2 |
| theme-color | #1e2327 |
| color-scheme | light dark |
Links:
Viewport: width=device-width