Support forums » Products » Cute Editor for .NET » Re: Drop-down menus display

Drop-down menus display

Last post 01-28-2009, 11:47 AM by MITFrog. 7 replies.
Sort Posts: Previous Next

  •  01-09-2009, 4:25 PM 47619

    Drop-down menus display

    Reply Quote
    I am having trouble with drop-down menus, which are displayed stacked rather than side by side, as shown below:
     
     
    I have downloaded the latest copy of the editor, and the problem does not go away.
     
    is there something I am doing to make this appear incorrectly?  Is there a way to make the menus appear as they show on your site?
     
    Thanks,

    Eric

  •  01-09-2009, 6:16 PM 47620 in reply to 47619

    Re: Drop-down menus display

    Reply Quote
    Eric,
     
    Are you using a custom toolbar configuration file? If so, please post the code.

    asp.net Chat http://cutesoft.net/ASP.NET+Chat/default.aspx
    Web Messenger: http://cutesoft.net/Web-Messenger/default.aspx
    asp.net wysiwyg editor: http://cutesoft.net/ASP.NET+WYSIWYG+Editor/default.aspx
    asp wysiwyg html editor: http://cutesoft.net/ASP
    asp.net Image Gallery: http://cutesoft.net/ASP.NET+Image+Gallery/default.aspx
    Live Support: http://cutesoft.net/live-support/default.aspx

  •  01-15-2009, 7:26 PM 47797 in reply to 47620

    Re: Drop-down menus display

    Reply Quote
    Here is one example...
    <?xml version="1.0" encoding="utf-8" ?>

    <configuration>

    <codeviewToolbars>

    <item type="g_start" />

    <item type="image" name="Print" />

    <item type="image" name="Find" />

    <item type="image" name="ToFullPage" command="FullPage" imagename="fit" hotkey="F12" />

    <item type="image" name="FromFullPage" command="FullPage" imagename="restore" hotkey="F12" />

    <item type="image" name="Cut" />

    <item type="image" name="Copy" />

    <item type="image" name="Paste" />

    <item type="image" name="SelectAll" />

    <item type="image" name="SelectNone" />

    <item type="g_end" />

    </codeviewToolbars>

    <toolbars>

    <item type="g_start" />

    <item type="image" name="Print" />

    <item type="image" name="preview" imagename="bspreview" />

    <item type="image" name="Find" />

    <item type="image" name="ToFullPage" command="FullPage" imagename="fit" hotkey="F12" />

    <item type="image" name="FromFullPage" command="FullPage" imagename="restore" hotkey="F12" />

    <item type="image" name="CleanCode" imagename="cleanup" />

    <item type="image" name="netspell" imagename="spell" />

    <item type="separator" />

    <item type="image" name="Cut" />

    <item type="image" name="Copy" />

    <item type="image" name="Paste" />

    <item type="image" name="PasteText" />

    <item type="image" name="PasteWord" />

    <item type="image" name="PasteAsHTML" />

    <item type="image" name="Delete" />

    <item type="separator" />

    <item type="image" name="Undo" />

    <item type="image" name="Redo" />

    <item type="g_end" />

    <item type="g_start" />

    <item type="image" name="Break" />

    <item type="image" name="InsertParagraph" imagename="Paragraph" />

    <item type="image" name="InsertDate" imagename="insertdate" />

    <item type="image" name="InsertTime" imagename="timer" />

    <item type="separator" />

    <item type="image" name="InsertChars" imagename="specialchar" />

    <item type="image" name="UniversalKeyboard" imagename="keyboard" />

    <item type="separator" />

    <item type="image" name="ImageGalleryByBrowsing" imagename="image" />

    <item type="image" name="InsertImage" imagename="eximage" />

    <item type="image" name="InsertDocument" imagename="document" />

    <item type="image" name="InsertTemplate" imagename="template" />

    <item type="image" name="Help" />

    <item type="g_end" />

    <item type="linebreak" />

    <item type="g_start" />

    <item type="image" name="Bold" />

    <item type="image" name="Italic" />

    <item type="image" name="Underline" imagename="under" />

    <item type="image" name="JustifyLeft" imagename="left" />

    <item type="image" name="JustifyCenter" imagename="center" />

    <item type="image" name="JustifyRight" imagename="right" />

    <item type="image" name="JustifyFull" />

    <item type="image" name="JustifyNone" />

    <item type="image" name="RemoveFormat" imagename="unformat" />

    <item type="forecolor" />

    <item type="backcolor" />

    <item type="g_end" />

    <item type="g_start" />

    <item type="image" name="InsertOrderedList" imagename="numlist" />

    <item type="image" name="InsertUnorderedList" imagename="bullist" />

    <item type="image" name="Indent" />

    <item type="image" name="Outdent" />

    <item type="image" name="Superscript" />

    <item type="image" name="Subscript" />

    <item type="image" name="StrikeThrough" imagename="strike" />

    <item type="image" name="Ucase" />

    <item type="image" name="Lcase" />

    <item type="g_end" />

    <item type="g_start" />

    <item type="image" name="InsertHorizontalRule" imagename="rule" />

    <item type="image" name="InsertLink" imagename="link" />

    <item type="image" name="Unlink" />

    <item type="image" name="ToggleBorder" imagename="borders" />

    <item type="image" name="SelectAll" />

    <item type="image" name="SelectNone" />

    <item type="g_end" />

    <item type="linebreak" />

    <item type="g_start" />

    <item type="dropdown" name="FormatBlock" width="70" RenderItemBorder="true" text="[[Paragraph]]"

    command="FormatBlock" />

    <item type="dropdown" name="FontName" width="110" text="[[FontName]]" command="FontName" />

    <item type="dropdown" name="FontSize" width="60" text="[[FontSize]]" command="FontSize" />

    <item type="g_end" />

    <item type="g_start" />

    <item type="image" name="BlockDirLTR" imagename="left_to_right" />

    <item type="image" name="BlockDirRTL" imagename="right_to_left" />

    <item type="image" name="BoxFormatting" imagename="box" />

    <item type="g_end" />

    </toolbars>

    </configuration>

  •  01-16-2009, 9:35 AM 47808 in reply to 47797

    Re: Drop-down menus display

    Reply Quote
    The above toolbar configuration file works fine here.
     
    Can you create a simple aspx page showing the problems?

    asp.net Chat http://cutesoft.net/ASP.NET+Chat/default.aspx
    Web Messenger: http://cutesoft.net/Web-Messenger/default.aspx
    asp.net wysiwyg editor: http://cutesoft.net/ASP.NET+WYSIWYG+Editor/default.aspx
    asp wysiwyg html editor: http://cutesoft.net/ASP
    asp.net Image Gallery: http://cutesoft.net/ASP.NET+Image+Gallery/default.aspx
    Live Support: http://cutesoft.net/live-support/default.aspx

  •  01-16-2009, 11:36 AM 47817 in reply to 47808

    Re: Drop-down menus display

    Reply Quote
    Adam:
     
    After some tests with examples, it has become clear that using a stylesheet theme and theme for the page is where the trouble comes from.  In other words, it works fine until I specify these two items for the page.
     
    Below is the stylesheet and theme info.  What here is causing the problem?
     
    STYLESHEET within theme folder
     
    /* Define normal text */
    P
    {
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        font-size: 10pt;
        font-family: Verdana;
    }
    TD
    {
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        font-size: 10pt;
        font-family: Verdana;
    }
    H1
    {
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        font-size: 16pt;
        font-family: Verdana;
        color: #00447c;
    }
    .H1
    {
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        font-size: 16pt;
        font-family: Verdana;
        color: #00447c;
    }
    H2
    {
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        font-size: 14pt;
        font-family: Verdana;
        color: #007cc2;
    }
    .H2
    {
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        font-size: 14pt;
        font-family: Verdana;
        color: #007cc2;
    }
    H3
    {
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        font-size: 13pt;
        font-family: Verdana;
        color: #01335b;
    }
    .H3
    {
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        font-size: 13pt;
        font-family: Verdana;
        color: #01335b;
    }
    H4
    {
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        font-size: 11pt;
        font-family: Verdana;
        color: #01335b;
    }
    .H4
    {
        font-style: normal;
        font-variant: normal;
        font-weight: bold;
        font-size: 11pt;
        font-family: Verdana;
        color: #01335b;
    }
    H5
    {
        font-style: italic;
        font-variant: normal;
        font-weight: bold;
        font-size: 10pt;
        font-family: Verdana;
        color: #01335b;
    }
    .H5
    {
        font-style: italic;
        font-variant: normal;
        font-weight: bold;
        font-size: 10pt;
        font-family: Verdana;
        color: #01335b;
    }
    /* Define masterpage banner text and background color */
    .bannertxt
    {
        font-style: italic;
        font-variant: normal;
        font-weight: bold;
        font-size: 12pt;
        font-family: Verdana;
        color: #01639a;
    }
    .banner
    {
        background-color: #ffffff;
    }
    /* define login text, menubar color */
    .logintxt
    {
        font-style: italic;
        font-variant: normal;
        font-weight: normal;
        font-size: 9pt;
        font-family: Verdana;
        color: #00447c;
    }
    .menu
    {
        background-color: #2f63a8;
    }
    /* Define tables with header */
    .newtable
    {
        border-right: gray thin solid;
        border-top: gray thin solid;
        border-left: gray thin solid;
        border-bottom: gray thin solid;
    }
    .tblhdr
    {
        text-align: center;
        background-color: #4c71a1;
        font-size: 10pt;
        font-weight: bold;
        color: #ffffff;
    }
    .tblcell
    {
        background-color: #c5ddf5;
        color: #224474;
    }
    .tblsmoke
    {
        background-color: #f5f5f5;
        color: #224474;
    }
    /* define basic column colors */
    .color1
    {
        background-color: #c0d635;
    }
    .color2
    {
        background-color: #93b9ee;
    }
    .color3
    {
        background-color: #c5ddf5;
    }
    div.centered
    {
    text-align: center;
    }
    div.centered table
    {
    margin: 0 auto;
    text-align: left;
    }
     
     
     
    THEME default.skin

    <aap:HyperLink runat="server"
      Font-Underline="True"
      ForeColor="#2462ab"></asp:HyperLink>
     
    <asp:HyperLink runat="server"
      Font="Verdana"
      Font-Size="9"
      Font-Bold="True"
      skinID="menulink"
      Font-Underline="False"
      ForeColor="#ffffff"></asp:HyperLink>
     
    <asp:LinkButton runat="server"
      Font-Underline="True"
      ForeColor="#2462ab"></asp:LinkButton>
     
    <asp:Image runat="server"
      BorderColor="#ffffff" />
     
    <asp:TextBox runat="server"
      Font-Names="Verdana"
      Font-Size="10pt"></asp:TextBox>
     
    <asp:ImageButton runat="server"
      BorderColor="#ffffff" />
     
      <%-- Details view for database page subtitles: 
      set ItemStyle BackColor="Transparent" CssClass="H3" for subtitle --%>
    <asp:DetailsView runat="server"
      skinID="Subtitle" 
      AutoGenerateRows="False"
      CellPadding="0"
      HorizontalAlign="Left"
      BorderWidth="0px"
      BorderStyle="None">
    </asp:DetailsView>

    <asp:DetailsView runat="server"
      BorderColor="Gray"
      CellPadding="2"
      HorizontalAlign="Center"
      BorderStyle="Solid"
      BorderWidth="2px">
     <CommandRowStyle
      Font-Bold="False"
      HorizontalAlign="Center" />
     <EditRowStyle
      BackColor="#f5f5f5"
      HorizontalAlign="Left"
      ForeColor="#224474" />
     <RowStyle
      BackColor="#f5f5f5"
      HorizontalAlign="Left"
      ForeColor="#224474" />
     <FieldHeaderStyle
      Font-Bold="True"
      HorizontalAlign="Right"
      VerticalAlign="Top" />
     <HeaderStyle
      BackColor="#4c71a1"
      Font-Bold="True"
      Font-Names="Verdana"
      Font-Size="10pt"
      HorizontalAlign="Center"
      ForeColor="White" />
     <InsertRowStyle
      BackColor="#f5f5f5"
      HorizontalAlign="Left"
      ForeColor="#224474" />
    </asp:DetailsView>

    <asp:GridView runat="server"
      AutoGenerateColumns="False"
      BackColor="WhiteSmoke"
      BorderColor="Gray"
      BorderStyle="Solid"
      BorderWidth="2px"
      CellPadding="2"
      HorizontalAlign="Center">
     <RowStyle
      BackColor="WhiteSmoke"
      ForeColor="#000060" />
     <PagerStyle
      BackColor="#5e87be"
      ForeColor="White"
      HorizontalAlign="Center" />
     <SelectedRowStyle
      BackColor="WhiteSmoke"
      ForeColor="#000060" />
      <HeaderStyle
      BackColor="#4c71a1"
      ForeColor="White"
      Font-Bold="True"
      HorizontalAlign="Center" />
     <EditRowStyle
      BackColor="WhiteSmoke"
      ForeColor="#000060" />
     <AlternatingRowStyle
      BackColor="#e3e3e3"
      ForeColor="#000060" />
    </asp:GridView>

    <asp:GridView runat="server"
      SkinID="WhiteRows"
      AutoGenerateColumns="False"
      BackColor="WhiteSmoke"
      BorderColor="Gray"
      BorderStyle="Solid"
      BorderWidth="2px"
      CellPadding="2"
      HorizontalAlign="Center">
     <RowStyle
      BackColor="White"
      ForeColor="#000060" />
     <PagerStyle
      BackColor="#5e87be"
      ForeColor="White"
      HorizontalAlign="Center" />
     <SelectedRowStyle
      BackColor="WhiteSmoke"
      ForeColor="#000060" />
      <HeaderStyle
      BackColor="#4c71a1"
      ForeColor="White"
      Font-Bold="True"
      HorizontalAlign="Center" />
     <EditRowStyle
      BackColor="WhiteSmoke"
      ForeColor="#000060" />
     <AlternatingRowStyle
      BackColor="White"
      ForeColor="#000060" />
    </asp:GridView>

    <asp:LoginStatus runat="server"
      SkinID="LoginStatus"
      Font-Bold="True"
      Font-Italic="false"
      Font-Underline="False"
      ForeColor="MidnightBlue" />

    <asp:LinkButton runat="server"
      skinID="Login"
      Font-Bold="True"
      Font-Italic="false"
      Font-Underline="False"
      ForeColor="MidnightBlue"></asp:LinkButton>
     

     
    And here is the editor code for the specific case I was testing:
     
        <CE:Editor ID="ceQuestionEditor" runat="server" BreakElement="Br" ConfigurationPath="~/CuteSoft_Client/CuteEditor/Configuration/wide-quiz.config"
            ContextMenuMode="None" EnableContextMenu="False" Height="150px" MaxHTMLLength="2000"
            MaxTextLength="2000" ShowBottomBar="False" Width="100%">
            <FrameStyle BackColor="White" BorderColor="#DDDDDD" BorderStyle="Solid" BorderWidth="1px"
                CssClass="CuteEditorFrame" Height="100%" Width="100%" />
        </CE:Editor>
     

  •  01-16-2009, 1:25 PM 47821 in reply to 47817

    Re: Drop-down menus display

    Reply Quote
    I guess this issue is caused by the style sheet you are using. That's why I want you create an example showing the problems.
     
    Now you can remove the code from the style sheet step by step untill youl find the ine of the offending code.

    asp.net Chat http://cutesoft.net/ASP.NET+Chat/default.aspx
    Web Messenger: http://cutesoft.net/Web-Messenger/default.aspx
    asp.net wysiwyg editor: http://cutesoft.net/ASP.NET+WYSIWYG+Editor/default.aspx
    asp wysiwyg html editor: http://cutesoft.net/ASP
    asp.net Image Gallery: http://cutesoft.net/ASP.NET+Image+Gallery/default.aspx
    Live Support: http://cutesoft.net/live-support/default.aspx

  •  01-16-2009, 1:44 PM 47823 in reply to 47821

    Re: Drop-down menus display

    Reply Quote
    The problem seems to be this code in the stylesheet:
     
    div.centered
    {
    text-align: center;
    }
    div.centered table
    {
    margin: 0 auto;
    text-align: left;
    }
     
    The purpose of this code is to fix a problem with safari, where it does not center stuff correctly.  Any thoughts on how to get around this?
     
    FYI, test page #1 is http://eduplex.org/CuteSoft.aspx  This one uses the stylesheet, but not a masterpage.
    Second test is http://eduplex.org/CuteSoft2.aspx.  This one DOES use a masterpage, and the very same stylesheet and theme, but it fails.
     

  •  01-28-2009, 11:47 AM 48157 in reply to 47823

    Re: Drop-down menus display

    Reply Quote
    It turns out that any attempt to set table margins in stylesheet code will cause this problem.  For example,

    table
    {
    margin-left: auto;
    margin-right: auto;
    }
     
    also causes the problem.  However, I did find a solution, and that is to encapsulate each drop-down menu into their own group, as shown below:
     
    <item type="g_start" />
    <    item type="dropdown" name="FormatBlock" width="70" RenderItemBorder="true" text="[[Paragraph]]"command="FormatBlock" />
    <    item type="g_end" />
    <    item type="g_start" />
    <    item type="dropdown" name="FontName" width="110" text="[[FontName]]" command="FontName" />
    <    item type="g_end" />
    <    item type="g_start" />
    <    item type="dropdown" name="FontSize" width="60" text="[[FontSize]]" command="FontSize" />
    <    item type="g_end" />
     
    By setting a g_start and g_end around each dropdown, the auto margins do not expand to fill the available space.  This does take slightly more horizontal menu room, but not much.
     
     
View as RSS news feed in XML