.#{$prefix}panel, .#{$prefix}plain { overflow: hidden; position: relative; } .#{$prefix}panel { outline: none; } @if $include-ie { // Fix for IE8 clipping. EXTJSIV-1553 td.#{$prefix}frame-mc { vertical-align: top; } } .#{$prefix}panel-bodyWrap { overflow: hidden; position: static; height: 100%; width: 100%; } .#{$prefix}panel-body { overflow: hidden; position: relative; } .#{$prefix}panel-header-plain, .#{$prefix}panel-body-plain { border: 0; padding: 0; } // If we're using framing on modern browsers, they are // part of the border/border-radius, but we also need to show // the collapsed splitter. In that case, just hide the panel so it // doesn't interfere with the positioning .#{$prefix}panel-collapsed-mini { visibility: hidden; } // This is required because viewport uses a min-height, not a height // to stretch the body. This means the bodyWrap height: 100% has no // effect because there's no explicit height. Use an alternative method // to stretch, but scope it only to the scenario where using a panel as // the viewport since using position: relative/absolute may not be a // good general solution .#{$prefix}viewport > .#{$prefix}body.#{$prefix}panel > .#{$prefix}panel-bodyWrap { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }