RadSpell button placement issues

11 posts, 1 answers
  1. Kosal
    Kosal avatar
    20 posts
    Member since:
    Nov 2007

    Posted 18 Nov 2008 Link to this post

    I am having two really odd problems with a RadSpell button.

    1.  I am placing the RadSpell button next to two other regular buttons.  However the RadSpell button keeps forcing itself onto the next line.  It won't stay on the same line as the other buttons.
    2.  I can't get it to center horizontally.  It is placed in a div with css applied to handle the centering of the objects.  Everything else is centered properly except for this RadSpell button.

    So it is forcing line breaks and won't center.  Any help will be appreciated.

    Thanks!



  2. Rumen
    Admin
    Rumen avatar
    12851 posts

    Posted 24 Nov 2008 Link to this post

    Hi Kosal,

    The spellcheck button is wrapped inside a DIV element which is block element that is why the next two buttons are rendered below it:

    <telerik:RadSpell id="RadSpell1" ControlToCheck="TextBox1" Runat="server"></telerik:RadSpell> 
    <asp:Button ID="Button1" runat="server" Text="Button" />
    <asp:Button ID="Button2" runat="server" Text="Button" />

    In order to render the two buttons on the same line with the spellcheck button you should set the following class:

        <style type="text/css">
        #RadSpell1
        {
            float: left;
        }
        </style>

    Best regards,
    Rumen
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Kosal
    Kosal avatar
    20 posts
    Member since:
    Nov 2007

    Posted 25 Nov 2008 Link to this post

    Thanks for the suggestion.  Unfortunately it didn't correct the problem.  I'm still having the same issues.
    Any other solution?
  5. Rumen
    Admin
    Rumen avatar
    12851 posts

    Posted 26 Nov 2008 Link to this post

    Hi Kosal,

    The solution works properly on my side. For your convenience I have attached my sample project. Could you please, modify it to fit your scenario and send it back so that I can reproduce the problem?

    Best regards,
    Rumen
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. Kosal
    Kosal avatar
    20 posts
    Member since:
    Nov 2007

    Posted 26 Nov 2008 Link to this post

    Rumen,

    I've taken your file and modified it for my scenario.
    All I'm trying to do is line up the 3 buttons (asp button, asp button, RadSpell button) and center them.

     

     

    <head id="Head1" runat="server">
    <title>Untitled Page</title>
    <style type="text/css">
    #RadSpell1
    {
    float: left;
    }
    #Div1
    {
    width:625px;
    margin-top: 20px;
    margin-left: 50px;
    margin-right: auto;
    text-align: center;
    }
    </style>
    </head>
    <body>
    <form id="form1" runat="server">
    <div>
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
    <div id="Div1" runat="server">
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <br />
    <asp:Button ID="Button1" runat="server" Text="Button" />
    <asp:Button ID="Button2" runat="server" Text="Button" />
    <telerik:RadSpell ID="RadSpell1" ControlToCheck="TextBox1" runat="server"></telerik:RadSpell>
    </div>
    </div>
    </form>
    </body>
    </html>

     

  7. Rumen
    Admin
    Rumen avatar
    12851 posts

    Posted 28 Nov 2008 Link to this post

    Hi Kosal,

    Please, find attached my test aspx page, which demonstrates the requested apperance.

    Best regards,
    Rumen
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  8. Kosal
    Kosal avatar
    20 posts
    Member since:
    Nov 2007

    Posted 01 Dec 2008 Link to this post

    I must be missing something because it still isn't working for me.
    The text box is centered but the buttons are still left aligned.  I need all 3 buttons to be centered also.
  9. Answer
    Martin
    Admin
    Martin avatar
    585 posts

    Posted 03 Dec 2008 Link to this post

    Hello Kosal,

    Please, find the corrected layout for the buttons you have requested.

    Regards,
    Martin Ivanov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  10. Kosal
    Kosal avatar
    20 posts
    Member since:
    Nov 2007

    Posted 03 Dec 2008 Link to this post

    This was the solution that i've had in place for this situation.  I just thought there was a better way to do it without using tables.

    Thanks for your help.

  11. Scott
    Scott avatar
    42 posts
    Member since:
    Oct 2007

    Posted 04 Dec 2008 Link to this post

    Kosal,
    I ran into the same problem and ended up having to put the RadSpell button in a list. This was a pain in the butt because I had to update all the toolbars where the RadSpell button was located. Here is what I ended up with:

     <style type="text/css">
        .menu ul,
        .menu li
        {
            padding: 0;
            margin: 0;
            list-style: none;
            height: 15px;
        }
        .menu li
        {
            float: left;
        }
    </style>

    <div class="menu">
        <ul>
            <li>(button one)</li>
            <li>(rad spell button)</li>
            <li>(button two, etc.)</li>
        </ul>
    </div>

     

     

     

     


    It would be great if the RadSpell button didn't automatically wrap itself and display as an inline element as opposed to a block element.

     

     

     

     

     

     

     

     

     

  12. Kosal
    Kosal avatar
    20 posts
    Member since:
    Nov 2007

    Posted 15 Dec 2008 Link to this post

    Thanks for the tip Scott.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017