formdecorator is squashing my buttons together

8 posts, 0 answers
  1. Chris Yoker
    Chris Yoker avatar
    411 posts
    Member since:
    Jul 2005

    Posted 24 Jul 2008 Link to this post

    hiya,

    I have 2 buttons declared as follows:

    <tr>
                    <td colspan="3" style="text-align: left" valign="top">
                        <asp:Button ID="btnCreate" runat="server" OnClick="btnCreate_Click" Text="Update"
                            Font-Size="9pt" />&nbsp;<asp:Button ID="btnClear" runat="server" OnClick="btnClear_Click"
                                Text="Clear" Font-Size="9pt" Enabled="true" /></td>
                </tr>

    When I add the formDecorator to the page, the buttons get squahed together, and I have to add additional "nbsp's"

    Is there a way to stop this?

    I thought I'd just have to drop the decorator on the page and it would conform with the html that is already in the aspx.

    I'm using ie 7

    many thanks,

    yogi
  2. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 25 Jul 2008 Link to this post

    Hi Chris,

    I tried to reproduce the problem, but I don't see difference no matter if I use formdecorator or not (see attached screenshot). I guess that the problem is not in this piece of code.
    Do you by any chance have some global styles on your page? This could be a reason for such problem.

    If you continue experiencing this behavior, please open a ticket and send us a small sample project where we can reproduce it. We will check it and get back to you.



    Greetings,
    Georgi Tunev
    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. Bruce St.Clair
    Bruce St.Clair avatar
    27 posts
    Member since:
    Jan 2008

    Posted 26 Aug 2008 Link to this post

    I got the same problem.

    With RadFormDec turned on
    http://update.timsforaudiology.com/bruce/2.png

    Turn off RadFormDec
    http://update.timsforaudiology.com/bruce/1.png


    here is the html code.  2008 Q2, VS2008


    <%

    @ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

    <%

    @ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>

    <!

    DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <

    html xmlns="http://www.w3.org/1999/xhtml">

    <

    head runat="server">

    <title>Untitled Page</title>

    </

    head>

    <

    body>

    <form id="form1" runat="server">

    <div>

    <telerik:RadScriptManager ID="RadScriptManager1" Runat="server"

    OutputCompression="AutoDetect">

    </telerik:RadScriptManager>

    <telerik:RadWindowManager ID="RadWindowManager1" runat="server" Visible="False">

    </telerik:RadWindowManager>

    <telerik:RadFormDecorator ID="RadFormDecorator1" Runat="server"

    EnableTheming="True" />

    <br />

    &nbsp;

    <asp:Button ID="btnResource" runat="server"

    style="z-index: 1; left: 267px; top: 16px; position: absolute; width: 78px; height: 26px; right: 584px"

    Text="Resources" Width="80px" />

    <asp:Button ID="btnProvider" runat="server"

    style="z-index: 1; left: 60px; top: 17px; position: absolute; width: 78px; height: 26px; right: 791px"

    Text="Providers" Width="80px" />

    <asp:Button ID="btnSite" runat="server"

    style="z-index: 10; left: 163px; top: 17px; position: absolute; width: 78px; height: 26px; "

    Text="Sites" Width="80px" />

    <br />

    <br />

    <br />

    </div>

    <div>

    <telerik:RadSplitter ID="RadSplitter1" Runat="server" Height="627px"

    Width="657px" FullScreenMode="True" HeightOffset="90" LiveResize="True">

    <telerik:RadPane ID="RadPane1" Runat="server" Height="201px" Width="225px">

    Left Pane

    </telerik:RadPane>

    <telerik:RadSplitBar ID="RadSplitBar1" runat="server"

    CollapseMode="Forward" />

    <telerik:RadPane ID="RadPane2" Runat="server" Height="305px" Width="657px">

    Right Pane

    </telerik:RadPane>

    </telerik:RadSplitter>

    </div>

    </form>

    </

    body>

    </

    html>



  5. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 27 Aug 2008 Link to this post

    Hello Bruce,

    The problem in your case comes from the absolute positioning of the buttons. I suggest to change the logic and to use margin-top and margin-left instead - you will not experience such problem then.



    Greetings,
    Georgi Tunev
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. Bruce St.Clair
    Bruce St.Clair avatar
    27 posts
    Member since:
    Jan 2008

    Posted 27 Aug 2008 Link to this post

    Georgi

     I changed the code to this but it still seems to throw the buttons where it want to.

    RadFormDec turned on 
    http://update.timsforaudiology.com/bruce/3.png

    RadFormDec turned off

    http://update.timsforaudiology.com/bruce/4.png


    Here is the code I changed

    <asp:Button ID="btnProvider" runat="server"

    style="z-index: 1; margin-left: 60px; margin-top: 16px; width: 78px; height: 26px;"

    Text="Providers" Width="80px" />

    <asp:Button ID="btnSite" runat="server"

    style="z-index: 1; margin-left: 263px; margin-top: 16px; width: 78px; height: 26px;"

    Text="Sites" Width="80px" />

    <asp:Button ID="btnResource" runat="server"

    style="z-index: 1; margin-left: 267px; margin-top: 16px; width: 78px; height: 26px;"

    Text="Resources" Width="80px" />




  7. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 29 Aug 2008 Link to this post

    Hello Bruce,

    Here is how to set the HTML correctly:
    <form id="form1" runat="server"
        <asp:ScriptManager ID="ScriptManager1" runat="server"
        </asp:ScriptManager> 
        <telerik:RadFormDecorator ID="FormDecorator1" runat="server" /> 
        <div style="margin-top:16px"
            <span style="padding-left:60px;"
            <asp:Button ID="btnProvider" runat="server" Style="z-index: 1; 
               width: 78px; height: 26px;" Text="Providers" Width="80px" /> 
            </span> 
             
            <span style="padding-left:263px;"
            <asp:Button ID="btnSite" runat="server" Style="z-index: 1; 
                width: 78px; height: 26px;" Text="Sites" Width="80px" /> 
            </span> 
             
            <span style="padding-left:267px;"
            <asp:Button ID="btnResource" runat="server" Style="z-index: 1; 
                width: 78px; height: 26px;" Text="Resources" Width="80px" /> 
            </span> 
        </div> 
    </form> 

    I hope this suits your requirements.


    All the best,
    Georgi Tunev
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  8. mac
    mac avatar
    137 posts
    Member since:
    May 2008

    Posted 29 Aug 2008 Link to this post

    i get the same issue when using office2007 skin
    buttons squish together. I am also getting TONS of errors popping up referring to the new telerik ui 2008.
    I updated the dll and xml  in the bin folder however this has not resolved the issues.
  9. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 01 Sep 2008 Link to this post

    Hi mac,

    In such case it would be best to open a support ticket and to send us a sample project where these problems can be reproduced along with detailed description of the desired behavior. This way we will have a better view over your exact setup and we will provide you with the most appropriate solution.


    Best wishes,
    Georgi Tunev
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017