CodeMirror fill Div và làm cho Div 100% height

Question

Có lẽ một giải pháp đã được trả lời, nhưng với tất cả các câu trả lời sai (hay còn gọi là câu trả lời không giải quyết được vấn đề này), rất khó để chọn lọc .

Vấn đề là thế này --- Làm thế nào để làm cho CodeMirror lấp đầy 100% của div cha mẹ --- mà không buộc phần còn lại của trang vào chiều cao 100% như thế này gây ra các vấn đề sau:

Khi sử dụng

html, body { height: 100%; } 

Bạn đang thông báo cho trang biết rằng toàn bộ chiều cao là cổng xem của trình duyệt cho toàn bộ trang bao gồm tất cả nội dung. Vấn đề với điều này, là tôi không muốn mọi thứ trên trang bị ràng buộc với tỷ lệ này. Những gì tôi muốn làm, là có quyền truy cập bình thường vào trang mà không vi phạm sự phản hồi (aka, mobile, etc support), và vẫn có một div duy nhất trên trang (bảng bên phải) có một div CHỈ CÓ THÌ div là 100% chiều cao --- của không gian trong div đó. Tôi không muốn 100% chiều cao tràn vào menu, đi bên dưới/trên menu, v.v. Nó phải nằm trong hộp.

Answer 1

Các bạn đã thử thuộc tính này:

/* Firefox */ 
height: -moz-calc(100vh - 190px); 
/* WebKit */ 
height: -webkit-calc(100vh - 190px); 
/* Opera */ 
height: -o-calc(100vh - 190px); 
/* Standard */ 
height: calc(100vh - 190px); 

Sử dụng calc kết hợp với vh cho phép bạn hạn chế kích thước của nguyên tố này vào vùng nhìn thấy được.