Button won't center

6 posts, 0 answers
  1. Web Services
    Web Services avatar
    243 posts
    Member since:
    Apr 2008

    Posted 19 Aug 2009 Link to this post

    I am using a form decorator and I can't get my button to center. Here is my code.
        <table width="350px">
            <tr>
                <td>
                    <center>
                        <span class="adminTableLabel">Description</span>
                        <asp:TextBox ID="descInput" runat="server" Height="100px" Width="200px"></asp:TextBox>
                        <asp:RequiredFieldValidator runat="server" ID="descValidator" ControlToValidate="descInput"></asp:RequiredFieldValidator>
                    </center>
                </td>
            </tr>
            <tr>
                <td>
                    <center>
                        <span class="adminTableLabel"></span>
                        <asp:Button ID="addEvent" runat="server" Text="Add" />
                        <br />
                        <asp:Label ID="output" Text="" runat="server"></asp:Label>
                    </center>
                </td>
            </tr>
        </table>
    When I take out the form decorator it centers fine. I'm sure it has something to do with the css the form decorator uses. How can I center this button? Thanks,
  2. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 20 Aug 2009 Link to this post

    Hello,

    I ran your code with and without RadFormDecorator, but I don't see difference in the position of the button (see attached screenshot). Could you please open a support ticket and send us a sample page along with all the CSS used in it that reproduces the problem? This will allow us to provide you with the most appropriate solution.


    Sincerely yours,
    Georgi Tunev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Web Services
    Web Services avatar
    243 posts
    Member since:
    Apr 2008

    Posted 20 Aug 2009 Link to this post

    I ended up nesting it into another table that was centered and that centered the button. Not the best approach but it works. Is there anyway I can access the css that these buttons use from the form decorator. If not access them, is there a way I can override any properties? Here is the code I used in case anyone else has the same problem.

    <table width="350px">
            <tr>
                <td>
                    <center>
                        <span class="adminTableLabel">Description</span>
                        <asp:TextBox ID="descInput" runat="server" Height="100px" Width="200px"></asp:TextBox>
                        <asp:RequiredFieldValidator runat="server" ID="descValidator" ControlToValidate="descInput"></asp:RequiredFieldValidator>
                    </center>
                </td>
            </tr>
            <tr>
                <td>
                    
                        <span class="adminTableLabel"></span>
                        <center>
                                <table><tr><td><asp:Button ID="addEvent" runat="server" Text="Add" /></td></tr></table>
                        <br />
                        <asp:Label ID="output" Text="" runat="server"></asp:Label>
                    </center>
                </td>
            </tr>
        </table>
  5. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 21 Aug 2009 Link to this post

    Hi,

    You could use IE Dev Toolbar / Firebug or a similar tool to examine what are the classes applied to a particular element and to override them if needed by using the !important directive.
    for example:
    .myclass
    {
     border: 1px solid red !important;
    }




    Regards,
    Georgi Tunev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  6. Web Services
    Web Services avatar
    243 posts
    Member since:
    Apr 2008

    Posted 21 Aug 2009 Link to this post

    So I located the css tags it is using. I know I have the correct one because when I added some padding it made the button bigger. However, it still won't center. This is what I am trying

     

    .radfdInnerSpan{

     

     

    text-align: center !important;

     

     

    margin-left: auto;

     

     

    margin-right: auto;

     

    }
    Here is actual html that is generated

  7. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 24 Aug 2009 Link to this post

    Hi,

    To be able to help we need to have a better view over your exact setup and layout. That is why I would like to ask you again to open a support ticket and send us a sample page along with all CSS used in it that reproduces the problem. We will check it and do our best to help.


    Regards,
    Georgi Tunev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017