Quiero mostrar en mi página web un grupo de pdf dentro de un div, de tal manera que el ancho del pdf mostrado sea siempre del mismo tamaño que el div, en la pantalla solo debe lo que tiene escrito el pdf y no los bordes o la barra de herramientas. También necesito que el usuario se desplace sobre el div principal para revisar y leer todos los archivos PDF, es decir, solo debe haber un desplazador y los archivos PDF deben mostrarse uno debajo del otro. Lo necesito de esta manera porque luego quiero detectar cuándo el usuario se desplaza hasta la parte inferior del div, a través de todos los archivos PDF.

Logré obtener la cantidad de páginas en el pdf con pdf lib, y luego configuré minHeight en las páginas multiplicadas por algún número que me dará la altura que necesito para un pdf del tamaño de una carta. Pero esto no resuelve el problema del ancho y también tiene dificultades cuando obtengo otros formatos en el pdf.

 { data && data !== [] && !loading ? data.map((contract, index) => { return ( <div key={index} style={{ position: 'relative', height: `${contract.pages}px` }} > <object height='100vh' width='100%' data={`${contract.url}#toolbar=0`} type='application/pdf' frameBorder='0' scrolling='no' style={{ minHeight: `${contract.pages}px`, overflow: 'hidden', scrolling: 'no' }} seamless='seamless' /> </div> ) }) : <ContractLoader /> }