Printing a Grid

asked 2013-11-08 22:45:03 +0800

Vimm gravatar image Vimm
1 1

updated 2014-01-06 21:34:21 +0800

I'm having trouble trying to print a grid. On screen it looks fine and fills the screen but when I print it the right side falls off the page. How can I make my grid print right?

Update: Here's an example to reproduce it in ZK 6.5. Simply load this page and print it.

    <div style="text-align:center">
      <label value="Testing" />
    <grid width="100%">
        <column width="50px" />
        <column />
          <label value="Test" />
          <label value="If Peter Piper picked a peck of pickled peppers how many pickled peppers did Peter Piper pick? How much wood would a woodchuck chuck if a woodchuck would chuck wood?" />

The resulting printout will have the woodchuck tongue twister cut off the page. It appears to be because ZK calculates a fixed with on everything, so even if I set everything to 100% it's converted to my screen width (1920px). But my paper is not 1920 x 1080, hence the problem. If I could simply set the width to 100% all would be well.

I have the same problem with height trying to print on multiple pages. To reproduce it just copy and paste the row a couple dozen times. When the content scrolls off my 1920x1080 screen then it prints a single page with a scrollbar...

delete flag offensive retag edit


Can u attach a screen shot so we can know what the issue

sjoshi ( 2013-11-11 04:40:30 +0800 )edit

The issue is with printing, not with display. I've added an example so you can print your own.

Vimm ( 2014-01-03 18:24:30 +0800 )edit

1 Answer

Sort by ยป oldest newest most voted

answered 2014-01-06 21:33:40 +0800

Vimm gravatar image Vimm
1 1

It's not the perfect solution but it'll print right if I override the grid's calculated width. Forcing the width to 100% makes it fill the page regardless of orientation (portrait or landscape). It will also print multiple pages but the screen won't scroll unless you set the html overflow.

  html {
    overflow: auto;
  .z-grid {
    width: 100% !important;
  .z-grid-body {
    width: 100% !important;

In IE8 it only prints two pages though. Page one has the header and page two has the grid, and if the grid won't fit it's chopped off.

link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

1 follower



Asked: 2013-11-08 22:45:03 +0800

Seen: 33 times

Last updated: Jan 06 '14

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More