CSS 미디어 인쇄 쿼리

Question

modal에 @media print 쿼리가 작동합니다. 그런 다음 PRINT 기능이있는 차트를 추가했습니다. 차트에서 PRINT를 시도했지만 Chrome 인쇄 대화 상자에 아무 것도 표시하지 않습니다. 나는 @media print 때문에 그것을 생각하고있다.

chart에 modal의 동일한 기능을 어떻게 추가 할 수 있습니까?

CSS 미디어 인쇄 :

@media print { 
    @page { 
    size: auto; 
    margin: 3mm; 
    margin-right: 57mm; 
    margin-left: 57mm 
    } 

    body * { 
    visibility: hidden; 
    } 
    #admissionSlip * { 
    visibility: visible; 
    overflow: visible; 
    } 
    #chart * { 
    visibility: visible; 
    overflow: visible; 
    } 
    #mainPage * { 
    display: none; 
    } 
    #printBtn { 
    display: none; 
    } 
    .modal { 
    position: absolute; 
    left: 0; 
    top: 0; 
    margin: 0; 
    padding: 0; 
    min-height: 550px; 
    visibility: visible; 
    /**Remove scrollbar for printing.**/ 
    overflow: visible !important; 
    } 
    .modal-dialog { 
    visibility: visible !important; 
    /**Remove scrollbar for printing.**/ 
    overflow: visible !important; 
    } 
    li { 
    page-break-after: auto; 
    } 

    /* Chart */ 

    .panel { 
    visibility: visible !important; 
    /**Remove scrollbar for printing.**/ 
    overflow: visible !important; 
    } 
} 

Answer 1

나는 그렇게 좋지 않은 생각하여 해결하지만, 내가 필요했다.

난 chart의 media print 및 modal의 css 파일을 분리하고 각 html 파일을 참조.

나는 그것이 좋은 생각이 아니며 그것은 아마 모범 사례는 아니지만 그것이 내가 필요로하는 것을했다고 알고있다. 감사.