переполнение-у: прокрутка не работает в Firefox

Пожалуйста, обратитесь к URL-адресу: http://jsfiddle.net/8tFnG/1/переполнение-у: прокрутка не работает в Firefox

<table border="1" cellspacing="0" cellpadding="1" width="100%"> 
    <colgroup> 
     <col span="1" style="width:5%"> 
      <col span="1" style="width:70%"> 
       <col span="1" style="width:25%"> 
    </colgroup> 
    <tr> 
     <td colspan="2"> 
      <div style="width:100%; box-shadow: 1px 1px 1px #cfcfcf; border-radius:10px; color:black; border:1px solid #e5e5e5; min-height: 100px;">Sample Text 1</div> 
     </td> 
     <td rowspan="5" style="vertical-align: top;"> 
      <section class="loginform"> 
       <fieldset style="border-radius: 5px; padding: 5px;height: 450px; border: solid 1px red; overflow: auto;"> 
        <legend>Template</legend> 
        <ul style="padding: 10px;"> 
         <li>one</li> 
         <li>Two</li> 
         <li>Three</li> 
         <li>Four</li> 
         <li>Five</li> 
         <li>one</li> 
         <li>Two</li> 
         <li>Three</li> 
         <li>Four</li> 
         <li>Five</li> 
         <li>one</li> 
         <li>Two</li> 
         <li>Three</li> 
         <li>Four</li> 
         <li>Five</li> 
         <li>one</li> 
         <li>Two</li> 
         <li>Three</li> 
         <li>Four</li> 
         <li>Five</li> 
         <li>one</li> 
         <li>Two</li> 
         <li>Three</li> 
         <li>Four</li> 
         <li>Five</li> 
        </ul> 
       </fieldset> 
      </section> 
     </td> 
    </tr> 
    <tr> 
     <td>val</td> 
     <td> 
      <div style="width:100%; box-shadow: 1px 1px 1px #cfcfcf; color:black; border:1px solid #e5e5e5; min-height: 80px;">1 Only</div> 
     </td> 
    </tr> 
    <tr> 
     <td>bal</td> 
     <td> 
      <div style="width:100%; box-shadow: 1px 1px 1px #cfcfcf; border-radius:10px; color:black; border:1px solid #e5e5e5; min-height: 80px;">2 only</div> 
     </td> 
    </tr> 
    <tr> 
     <td>nal</td> 
     <td> 
      <div style="width:100%; color:black; box-shadow: 1px 1px 1px #cfcfcf; border-radius:10px; color:black; border:1px solid #e5e5e5; min-height: 80px;">Both 1 and 2</div> 
     </td> 
    </tr> 
    <tr> 
     <td>dul</td> 
     <td> 
      <div style="width:100%; box-shadow: 1px 1px 1px #cfcfcf; border-radius:10px; color:black; border:1px solid #e5e5e5; min-height: 80px;">Neither 1 nor 2</div> 
     </td> 
    </tr> 
    <tr> 
     <td></td> 
     <td></td> 
    </tr> 
</table>

переполнение-у: прокрутка не работает в Firefox; любая идея исправить? [Вы можете посмотреть раздел шаблонов с правой стороны]

источник

2013-12-16 Pawan Mude

Я использую Firefox версии: 23.0.1 –

This is a bug. Свойство переполнения не реализовано в полях в firefox. Вам нужно использовать набор полей? Если нет, я бы предложил изменить его в DIV:

Изменение:

<fieldset style="border-radius: 5px; padding: 5px;height: 450px; border: solid 1px red; overflow: auto;">

к:

<div style="border-radius: 5px; padding: 5px;height: 450px; border: solid 1px red; overflow: auto;">

источник

2013-12-19 10:12:29 Andy

Спасибо Эндрю за ответ подробно. Это очень полезно. –

@Andrew Pope У меня есть аналогичная проблема, но с элементом формы. Есть ли другое решение для этого? Как, конечно, я не могу изменить его в div? –

Набор overflow:auto на участке: .loginform (родительский элемент FIELDSET)

UPDATED FIDDLE

.loginform 
{ 
    height:450px; 
    overflow: auto; 
}

источник

2013-12-19 10:17:48 Danield

Спасибо Danield за решение. Это полезно. –

Следует упомянуть переполнение для section, а не fieldset.

<section class="loginform" style="overflow-y: auto;">

И добавить height: auto для FIELDSET, так что содержание не течет снаружи.

<fieldset style="border-radius: 5px; padding: 5px;height: 450px; border: solid 1px red; height: auto">

Проверить эту скрипку http://jsfiddle.net/Ajey/ZK3yJ/

источник

2013-12-19 11:39:04 Ajey

переполнение-у: прокрутка не работает в Firefox

ответ

Смежные вопросы