الارتفاع: مشكلة 100 ٪ في IE7 ، وليس في FF

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

سؤال

أريد عرض صفحة بدون شريط تمرير (الارتفاع: 100 ٪). لقد قرأت اقتراحات لإضافة هذه الحجة إلى لغة البرمجة و هيئة. لكنه لا يعمل كما أتوقع. في الواقع ، أنا لا أرى شريط التمرير. ولكن في IE7 و 8 (وضع المعايير) يوجد شريط تمرير. في وضع المراوغات يعمل كما هو متوقع. يرجى القاء نظرة على هذا:

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
    <!-- saved from url=(0053)http://apptools.com/examples/tables/standardscss.html -->
    <html><head><title>standards compliance mode with css rendering</title>
    <meta content="text/html; charset=iso-8859-1" http-equiv=content-type>
    <meta content=no http-equiv=imagetoolbar>
    <meta name=mssmarttagspreventparsing content=true>
    <style type=text/css>body {
        padding-bottom: 0px; background-color: #fff; margin: 0px; padding-left: 0px; padding-right: 0px; color: #000; padding-top: 0px
    }
    table {
        border-bottom: #008 1px solid; border-left: #008 1px solid; border-top: #008 1px solid; border-right: #008 1px solid
    }
    html {
        height: 100%
    }
    body {
        height: 100%
    }
    .fullheight {
        height:100%
    }
    </style>

    <meta name=generator content="mshtml 8.00.6001.18876"></head>
    <body>
    <table width=450 bgcolor=#ccccff align=center height="100%">
      <tbody>
      <tr>
        <td colspan="2" height="200px">
          <p>paragraph</p>
    </td></tr>
      <tr class="fullheight"><td >
      <p>paragraph</p>
      </td>
      <td>
      <p>paragraph</p>
      </td>
      </tr>


      </tbody></table></body></html>

لا يوجد حل صحيح

نصائح أخرى

أم ... ما تطلبه يمكن أن يدخل في منطقة معقدة ، لكنني أبدأ بالقضاء على التناقضات في الكود الخاص بك. علي سبيل المثال:

  • طاولتك ارتفاع 100 ٪.
  • في الداخل ، لديك ارتفاع 200 بكسل <td> داخل واحد <tr>
  • في الداخل ، لديك أيضًا ثانية بنسبة 100 ٪ <tr>

لذلك أنت تخبر الرمز أن 100 ٪ + 200px = 100 ٪. يفشل هذا بشكل منطقي ، على الرغم من أنك قد ترغب في اختراق الكود بهذه الطريقة أحيانًا.

أولاً ، حاول ضبط الخصائص بحيث تعمل بشكل منطقي ومحاولة تقليل التعليمات البرمجية إلى بساطة أكبر ، ثم تعمل في طريقك من هناك. بعد ذلك ، إذا كان شريط التمرير لا يزال يظهر ، فربما تحتاج إلى البدء في التغيير والتعديل بهوامش سلبية. سيصبح هذا "حميميًا" مع رمزك بحيث يكون أي شخص ينصح بصراحة سيحتاج إلى شعور واضح بأهدافك ، بدلاً من تقديم المشورة بشأن عناصر الكود الفردي.

إذا كانت المشكلة هي شريط التمرير ، فيمكنك استخدام سمة CSS "Overflow" من أجل فرض السلوك:

  • مرئي: لا يتم قطع الفائض. إنه يجعل خارج صندوق العنصر. هذا افتراضي ؛
  • مخفي: يتم قص الفطائر ، وسيكون بقية المحتوى غير مرئي ؛
  • التمرير: يتم قطع التدفق الزائد ، ولكن تتم إضافة شريط التمرير لرؤية بقية المحتوى ؛
  • Auto: إذا تم قطع التدفق الزائد ، فيجب إضافة شريط التمرير لرؤية بقية المحتوى.
مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top