IE7: كيفية جعل TD تعويم؟

Question

وأريد مجموعة من <td>s لتطفو اليسار في IE7. ينبغي أن كسر على السطر التالي إذا كان إطار صغير جدا.

وCSS

table {
  width: 100%;
}
td {
  border: 1px solid red;
}
tr.f td {
  width: 500px;
  float: left;
}

وHTML:

<table>
  <tr class="f">
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
</table>

وهذا يعمل في IE8 وفايرفوكس، ولكن ليس في IE7. ما أفعل الخطأ؟

ووضع صفحة التقديم هو "IE7 (المراوغات)" أو "IE7 (المعايير)". أحاول مع IE8، على الرغم من الثقة التي وضع IE7 تقديم ما تقول. "IE8 عرض التوافق" فشل أيضا، فقط "معايير IE8" يحصل على ذلك الحق.

Answer 1

وأنا لا أعتقد أن هذا هو الممكن بالطريقة التي تريدها.

عند تطبيق تعويم لTD عناصر [في FF / IE8 [تصبح مجهولة الأجسام الجدول حسب CSS 2.1 المواصفات. في الأساس، وأنها لم تعد خلايا الجدول، وهذه الكائنات مجهولة لديهم نوع العرض الذي هو قابل للطفو.

وIE7 لا يتبع هذا الجزء من المواصفات، في الواقع، نوع العرض من الخلايا لا يمكن تغييرها في كل شيء، والأشياء مع نوع العرض من الجدول الخلية لا يمكن طرحها.

إذا كنت في حاجة على الاطلاق لاستخدام الجدول (بدلا من المجاهدين / لي) هل يمكن أن تفعل شيئا من هذا القبيل بدلا من ذلك؟

<style type="text/css" media="screen">`
    table {
        width: 100%;
    }
    .f {
        border: 1px solid red;
        float: left;
        height: 10px;
        width: 500px;
    }
</style>

<table summary="yes">
    <tr><td>
    <span class="f">1</span>
    <span class="f">2</span>
    <span class="f">3</span>
  </td></tr>
</table>

Answer 2

وأفضل تخمين بلادي: IE7 ولها أدناه نماذج الجدول صرامة ولا تسمح لك لتغيير تدفق عناصر الجدول