Проблема переполнения в CSS

Question

У меня есть iframe на моей странице, и мне кажется, что он сталкивается с некоторой общей проблемой ... E На самом деле есть 2 iframe ... 1. Заголовок iframe, в котором есть таблица с несколькими столбцами ... 2. Содержимое iframe, в котором есть таблицас данными столбцов ..

Теперь 2 таблицы iframe выровнены по вертикали ...

Выравнивание работает нормально, если столбцы меньше и во втором iframe нет полосы прокрутки ..

Но если столбцы увеличиваются, я получаю горизонтальную полосу прокрутки в «только» в iframe контента, и при прокрутке я получаю синхронизирующую JS, которая также прокручивает верхний iframe. Теперь в конце bcoz полос прокрутки, занимающихпространство, вертикальное выравнивание нарушается ..

Поскольку это кажется типичной проблемой, есть ли у кого-нибудь решение, которое было бы действительно полезным.Я открыт для подхода CSS / Js .. Спасибо ..

Answer 1

вы можете отрегулировать высоту iframe, если полосы прокрутки присутствуют, просто сравните iframes scrollWidth с его offsetWidth и, если ширина прокрутки выше, увеличьте высоту iframe на высоту полосы прокрутки, примерно на 5-10 пикселей Я должен проверить, чтобы быть уверенным.

Что-то вроде:

$('#my_frame).ready(function(){
  if(this.scrollWidth>this.offsetWidth){
    $(this).css({height:'+=10'});
  }
}