Wrap Text and align center

3 posts, 1 answers
  1. devApps
    devApps avatar
    37 posts
    Member since:
    Dec 2015

    Posted 21 Feb Link to this post

    I have multiple pages in a scroll view.

    To wrap the text with in each page I have used the following :

    <div data-role="scrollview" data-content-height="100%" data-pager-overlay="true">
                    <div data-role="page" style="white-space : normal;">
                        <span style="text-align:center;">Privilege Club: Mouawad</span>

    I have used style="white-space : normal;" to wrap the text.

    I saw this as a solution mentioned in one of the very old posts in this forum.

    Please let me know if there is any other or better solution now.

    This works fine but when I try to center align a text with in the span element it is still aligned left

    How can I make it aligned center ?

    I also used width:100% for the span element but invain.

    Could you please help me with this simple task ?

  2. devApps
    devApps avatar
    37 posts
    Member since:
    Dec 2015

    Posted 21 Feb in reply to devApps Link to this post

    Note : If I use a div element instead of the span it is working fine.

     

  3. Answer
    Magdalena
    Admin
    Magdalena avatar
    463 posts

    Posted 21 Feb Link to this post

    Hi,

    Span element is an inline element, so it you would like to expand them by setting width 100%, it is necessary to set display CSS property to inline-block or block. If you set the property to block, it is not necessary to set its width to 100%.

    The other option is to set text-align: center to the parent of the span.

    Regards,
    Magdalena
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top