我有一个谷歌水平条形图,根据项目数量动态向下增长,最高可达2500像素。
<div class="page">
<div class="pagecontent">
<div id="chart" style="width:80%; height: ${chartHeight}px;"></div>
</div>
</div>
我打算在打印时将其装入一整页。没有任何浏览器似乎关心我设置的宽度/高度,无论我尝试的最小高度,最大高度和高度的组合。尝试设置100%和像素值,但2500px图表总是高达一页半。
div.page {
page-break-after: always;
}
.pagecontent
{
margin: 40px 5px 5px 5px;
}
@media print {
body {font-size: xx-small;}
#chart {width: 100% !important; min-height:100px !important ;max-height:100px !important; height:100px !important;}
div.pagecontent {margin: 5px;}
}
拟合高度是较小的问题,问题是图表的一半因为太宽而丢失。