.collectionSchemaView-container { border-style: solid; box-sizing: border-box; .collectionfreeformview-container { border-width: 0px !important } .imageBox-cont { position:relative; max-height:100%; } .ReactTable { position: absolute } .ReactTable .rt-th, .ReactTable .rt-td { max-height: 75px; } .imageBox-cont img { object-fit: contain; height: 100% } .documentView-node { width:100% !important; height:100% !important; .imageBox-cont img { object-fit: contain; max-width: 100%; height: 100% } } } .Resizer { box-sizing: border-box; background: #000; opacity: 0.5; z-index: 1; background-clip: padding-box; &.horizontal { height: 11px; margin: -5px 0; border-top: 5px solid rgba(255, 255, 255, 0); border-bottom: 5px solid rgba(255, 255, 255, 0); cursor: row-resize; width: 100%; &:hover { border-top: 5px solid rgba(0, 0, 0, 0.5); border-bottom: 5px solid rgba(0, 0, 0, 0.5); } } &.vertical { width: 11px; margin: 0 -5px; border-left: 5px solid rgba(255, 255, 255, 0); border-right: 5px solid rgba(255, 255, 255, 0); cursor: col-resize; &:hover { border-left: 5px solid rgba(0, 0, 0, 0.5); border-right: 5px solid rgba(0, 0, 0, 0.5); } } &:hover { -webkit-transition: all 2s ease; transition: all 2s ease; } } .vertical { section { width: 100vh; height: 100vh; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } header { padding: 1rem; background: #eee; } footer { padding: 1rem; background: #eee; } } .horizontal { section { width: 100vh; height: 100vh; display: flex; flex-direction: column; } header { padding: 1rem; background: #eee; } footer { padding: 1rem; background: #eee; } } .parent { width: 100%; height: 100%; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .header { background: #aaa; height: 3rem; line-height: 3rem; } .wrapper { background: #ffa; margin: 5rem; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; }