How to change height or width of pdf in react (npm react-pdf)

Question

Change the loaded pdf layout (height and width) in react-pdf.

This includes :

1. Load pdf in reactjs
2. Modify height and width of pdf.

Answer 1

First if you want to load a pdf in reactjs, you can refer this article https://levelup.gitconnected.com/displaying-pdf-in-react-app-6e9d1fffa1a9

And you can also clone https://github.com/wojtekmaj/react-pdf

After that, add some css to position it to center and define your own height and width of the document

.react-pdf__Page__canvas {
    margin: 0 auto;
    width: 80% !important;
    height: 100% !important;
}

And you are good to go.