我有一个包含多个图表的页面,网格状格式如下：
[ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ] [ ]
每个图表都显示在一个包含float：left的包装中,而图表所在的div则显示为overflow：auto.这给出了将图表包装到屏幕宽度所需的布局.
我遇到的问题是,在打印模式下,这只会打印一页并丢失其余部分(第一页也是空白).我已经阅读了一点,并了解解决方案在大多数情况下是转动应用浮点数：无解决上述问题…但我丢失了网格格式,我想在打印页面上有多列图表.
我怎样才能解决这个问题？
我正在使用打印样式表,但这里是屏幕样式：
.chartSpace /* surrounds all charts */
{
padding-top: 20px;
width: auto;
overflow: auto;
}
.chartWrapper /* wrapper for each chart */
{
float: left;
padding: 0 20px 0 0;
}
解决方法
Float在print css中不能很好地工作,所以删除浮点数或用float：none覆盖它们并使用inline-block代替：
.chartWrapper {
float: none;
display: inline-block;
vertical-align: top;
padding: 0 20px 0 0;
}
