[CLOSED] MinLengthText width doesn't fit the text in Mac-Safari for ext:textfield

  1. #1

    [CLOSED] MinLengthText width doesn't fit the text in Mac-Safari for ext:textfield

    I have a ext:textfield on which i am enforcing a min length and max length rule and providing a minlengthtext that is to be displayed if the entered characters do not meet the defined rules. This text is displaying fine in Mozilla, Chrome, Edge and IE. However it gets clipped off in Safari on Mac.

    Code Snippet :

    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <!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></title>
        <style type="text/css">
            .font15 {
                font-size: 15px;
                margin: 5px 0;
            }
    
    
            #txtConfirmName-inputEl {
                border: 1px solid #ccc;
                border-radius: 4px;
                height: 40px;
                font-size: 15px;
                padding: 10px;
                background: #fff;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
            <ext:ResourceManager runat="server" Namespace="" Theme="Gray" />
            <ext:Viewport ID="Viewport1" runat="server" Layout="VBoxLayout" Cls="authBodybgColor" OverflowY="Auto" OverflowX="Hidden">
                <LayoutConfig>
                    <ext:VBoxLayoutConfig Align="Center" Pack="Center" />
                </LayoutConfig>
                <Items>
                <ext:TextField ID="txtConfirmName" runat="server" AnchorHorizontal="100%" autocomplete="off" MinLengthText="6-12 Characters"
                    FieldLabel="Confirm Name" Text="" MinLength="6" MaxLength="12" EnforceMaxLength="true"
                    LabelAlign="Top" TabIndex="1" MaskRe="[^-\s]" Cls="font15 input" LabelStyle="padding:5px 0; font-size:15px; margin-right:10px; margin-left:20px;" EnableKeyEvents="true" />
            </Items>
                </ext:Viewport>
        </form>
    </body>
    </html>
    Attached Thumbnails MinLengthTextCSS.jpg  
    Last edited by Daniil; Nov 16, 2016 at 7:39 AM. Reason: [CLOSED]
  2. #2
    Hello @iansriley!

    This bug in Ext.NET 2 (which uses ExtJS 4) was fixed on Ext.NET 3 series (with ExtJS 5). This problem was inherent from ExtJS, logged and fixed in their history. You can check it out here: QuickTip tooltips and Safari 7.

    Hope this helps!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. Replies: 1
    Last Post: Aug 21, 2013, 5:47 PM
  2. Replies: 2
    Last Post: Jan 31, 2013, 4:56 PM
  3. Page doesn't display on Safari browser
    By fac in forum 1.x Help
    Replies: 8
    Last Post: Jan 07, 2012, 9:56 AM
  4. Replies: 6
    Last Post: Jun 11, 2010, 12:47 PM
  5. Replies: 4
    Last Post: Aug 31, 2009, 12:10 PM

Posting Permissions