paper-css | Paper CSS for happy printing | Document Editor library

 by   cognitom CSS Version: 0.4.1 License: MIT

kandi X-RAY | paper-css Summary

kandi X-RAY | paper-css Summary

paper-css is a CSS library typically used in Editor, Document Editor, React applications. paper-css has no bugs, it has no vulnerabilities, it has a Permissive License and it has medium support. You can download it from GitHub.

Front-end printing solution - previewable and live-reloadable!. Recently, we say "front-end" every day. Then why don't we make the printing documents in front-end? We believe we can make it perfectly without back-end. Paper CSS is just a small snippet of CSS, but it helps us create them in browser easily.

            kandi-support Support

              paper-css has a medium active ecosystem.
              It has 2278 star(s) with 340 fork(s). There are 65 watchers for this library.
              It had no major release in the last 12 months.
              There are 24 open issues and 17 have been closed. On average issues are closed in 39 days. There are 4 open pull requests and 0 closed requests.
              It has a neutral sentiment in the developer community.
              The latest version of paper-css is 0.4.1

            kandi-Quality Quality

              paper-css has no bugs reported.

            kandi-Security Security

              paper-css has no vulnerabilities reported, and its dependent libraries have no vulnerabilities reported.

            kandi-License License

              paper-css is licensed under the MIT License. This license is Permissive.
              Permissive licenses have the least restrictions, and you can use them in most projects.

            kandi-Reuse Reuse

              paper-css releases are not available. You will need to build from source code and install.
              Installation instructions, examples and code snippets are available.

            Top functions reviewed by kandi - BETA

            kandi's functional review helps you automatically verify the functionalities of the libraries and avoid rework.
            Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of paper-css
            Get all kandi verified functions for this library.

            paper-css Key Features

            No Key Features are available at this moment for paper-css.

            paper-css Examples and Code Snippets

            No Code Snippets are available at this moment for paper-css.

            Community Discussions


            Web rendered size doesn't match print size
            Asked 2020-Sep-04 at 05:09

            First of all, I do search and research and try this about a week and has no clue.. so I thought I have earned my right asking somewhat simple, haha!

            For some reason, it looks like, width: 210mm; doesn't work as I want. Following screenshot rendered as print mode with F12 tool on chrome.

            This is css..



            Answered 2020-Aug-31 at 08:54

            I've worked with chromes print function in the past and the best way i found to fix these kinds of rendering problems was to brute force it.

            Basically change the .page-frame size until it fits.

            Although I have to say that your problem seems weird to me since if I remember correctly then the pixel sizes of your .page-frame are inline with what I used.

            From the information I can gather from the picture, chrome might be including the margins of .page-frame in to the render. So zero them out forcefully in css.

            You could also try to set the "scale" in print options higher to see if that fixes the problem.



            Flexbox centering within paper-css A4 page
            Asked 2017-Aug-18 at 16:25

            I'm writing an A4 paper in HTML/CSS with paper-css but I'm having some trouble with the centering (

            Current result:

            Desired result:




            Answered 2017-Aug-18 at 16:24

            The problem is that your flex container is set to flex-direction: row (by default).

            That means that you're flex items are horizontally aligned, creating two columns. The content in each item cannot invade the column space of the sibling, so centering horizontally on the page is not possible.

            A better method would be to use flex-direction: column. This aligns your items vertically.

            Then use justify-content: space-between to pin items to the top and bottom.

            Then, add a single and invisible pseudo-element to serve as a flex item, which forces the heading to the vertical center.


            Community Discussions, Code Snippets contain sources that include Stack Exchange Network


            No vulnerabilities reported

            Install paper-css

            Get Paper CSS from cdnjs (recommended):.


            For any new features, suggestions and bugs create an issue on GitHub. If you have any questions check and ask questions on community page Stack Overflow .
            Find more information at:

            Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items

            Find more libraries
          • npm

            npm i paper-css

          • CLONE
          • HTTPS


          • CLI

            gh repo clone cognitom/paper-css

          • sshUrl


          • Stay Updated

            Subscribe to our newsletter for trending solutions and developer bootcamps

            Agree to Sign up and Terms & Conditions

            Share this Page

            share link