عندما الجداول الحصول على تحميل البيانات ، الأيسر الجداول يستغرق الشاشة بأكملها و حق الجداول الحصول على مزدحم

StackOverflow https://stackoverflow.com/questions/1635439

  •  06-07-2019
  •  | 
  •  

سؤال

لقد كان وجود هذا محبطة بدلا المشكلة ، وبعد أن فشلت مرات عديدة, أنا على أمل شخص هنا يستطيع مساعدتي.ما يحدث هو أن هذه الجداول على الجانب الأيسر من الصفحة تظهر بخير و تفعل ما كنت من المفترض القيام به عند ترجمة.ومع ذلك ، بمجرد تحميله على الشبكة الداخلية للشركة و تحميل البيانات بهذه الطريقة (نفس البيانات راجع للشغل) ، الجداول على يسار الصفحة تنفجر عبر الشاشة بعد قرار من جهاز الكمبيوتر المحمول العمل (1600x900) في حين الجداول على اليمين على تقلصت إلى حوالي 1/4 حجمها.

لذا يرجى مساعدة ، وقد كان محبطا لي لساعات.أدناه سوف تجد الصفحة .aspx ورقة الأنماط.أنا بعد أفضل فريقين من الجداول.

ShippingReference.aspx

<table style="width: 1000px;">
        <tr style="height: 800px;">
            <td style="width: 50%; height: 100%;" valign="top">
                <asp:Panel runat="server" ID="pnlMainInfo" style="margin:20px; background-color:#ccccff" GroupingText="Main Information:">
                    <table style="width:100%; height:100%;">

                        <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Terms:</h2> </div>
                                    <asp:TextBox ID="txtTerms" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                        <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Acceptable Carriers:</h2> </div>
                                    <asp:TextBox ID="txtCarriers" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                        <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Routing/Order Submit Time Line:</h2> </div>
                                    <asp:TextBox ID="txtTimeLine" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                        <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Appointment Information Required:</h2> </div>
                                    <asp:TextBox ID="txtAppointmentInformation" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                        <tr align="center">
                             <td style="width: 25%;">
                                 <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Carton Markings Required:</h2> </div>
                                    <asp:TextBox ID="txtCartonMarkings" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                        <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Special Labels Required:</h2> </div>
                                    <asp:TextBox ID="txtSpecialLabels" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                         <tr align="center">
                            <td style="width: 25%;">
                                 <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Shipping Contacts:</h2> </div>
                                    <asp:TextBox ID="txtShippingContacts" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                        <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Routing Website:</h2> </div>
                                    <asp:TextBox ID="txtRoutingWebsite" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                        <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Customer Website Instructions/Trouble Shooting:</h2> </div>
                                    <asp:TextBox ID="txtCustWebsite" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                    </table>
                </asp:Panel>

                <cc1:CollapsiblePanelExtender ID="pnlMainInfo_CollapsiblePanelExtender" 
                    runat="server" Enabled="True" TargetControlID="pnlMainInfo">
                </cc1:CollapsiblePanelExtender>
            </td>

            <td style="width: 50%; height: 100%;" valign="top">
                <asp:Panel runat="server" ID="pnlEDI"  style="text-align:center; margin:20px; background-color:#ccccff" GroupingText="EDI:">
                    <table style="width:100%; height:100%;">

                        <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Contact for Missed Pickup by Carrier:</h2> </div>
                                    <asp:TextBox ID="txtMissedPickupContact" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                        <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Plant EDI Documents Required:</h2> </div>
                                    <asp:TextBox ID="txtPlantEDI" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                        <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>DI EDI Documents Required:</h2> </div>
                                    <asp:TextBox ID="txtDirectImportEDI" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                         <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Import/Direct Import ISF Requirements:</h2> </div>
                                    <asp:TextBox ID="txtISFRequirements" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                        <tr align="center">
                            <td style="width: 25%;">
                                 <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Import/Direct Import Customer Broker/Notify Party:</h2> </div>
                                    <asp:TextBox ID="txtCustomerBroker" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                        <tr align="center">
                            <td style="width: 25%;">
                                <div class="TBox" style="width: 90%; height: 100%;">
                                    <div class="header"> <h2>Other Shipping Documents Required:</h2> </div>
                                    <asp:TextBox ID="txtOtherShippingDocuments" runat="server" TextMode="MultiLine" Rows="5" MaxLength="500" Width="93%" CssClass="text" />
                                </div>
                            </td>
                        </tr>

                    </table>    
                </asp:Panel>
            </td>
        </tr>

ورقة نمط:

body { text-align:center; }

.lblErrorMessage    { font-family: Tahoma; font-size: 9pt; color: red; }

.TBox {
    color:#333333;
    font-size:11px;

    background: url('../../Images/box_bottom_right.gif') no-repeat bottom right;
    margin: 0;
    padding:0;
    font-family:Verdana, Arial, Helvetica, sans-serif;
}

.TBox .header {
    margin: 0;
    padding: 0;
    background: url('../../Images/box_top_right.png') no-repeat top right;
    text-align: center;
}

.TBox .header h2 {
    color:#ffffff;

    background: url('../../Images/box_top_left.png') no-repeat top left;
    font-size:14px;
    padding-top: 7px;
    height:20px;
    margin: 0;
}

.TBox .text {

    background: url('../../Images/box_bottom_left.gif') no-repeat bottom left;
    padding:10px 10px 15px 10px;    
    margin:0;
    height:auto;
    text-align:justify;
    color:#003399;
    line-height:15px;
}
هل كانت مفيدة؟

المحلول

حاول أولا تنظيف الصفحة قليلا ثم فإنه ينبغي أن يكون من الأسهل إلى "تصحيح":

  • مكان كل التصميم في ورقة الأنماط الخاصة بك ، وخاصة المتكررة width-الصفات.
  • إزالة لا لزوم لها/زائدة به ، أيالتصميم محددة مع <div class="header"> يجب أن تكون على <h2> الوسم

أنا أدرك أن هذا ليس هو الجواب الذي تبحث عنه ، ولكن يجب أن defininately تساعدك على معرفة المشكلة.أو على الأقل جعل الخاص بك التعليمات البرمجية أسهل للقراءة لأي شخص آخر.:)

نصائح أخرى

وأهه .... تغيير الجداول لعناصر div ...

وراجعت التعليمات البرمجية في IE، والكروم، وموزيلا. بالنسبة لي يبدو للعمل بشكل صحيح. نظام بلدي دقة الشاشة هو 1280 * 800. أفضل U إنشاء div.Make الرئيسية عرضه: 100٪. ثم إنشاء جدولين داخل هذا div.Each من العرض: 50٪. لا تستخدم الكثير من عرض ATTRIB ل.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top