3 files changed, 10 insertions, 15 deletions

diff --git a/src/client/views/nodes/PDFBox.tsx b/src/client/views/nodes/PDFBox.tsx
index 5501f0a31..4deb1f207 100644
--- a/src/client/views/nodes/PDFBox.tsx
+++ b/src/client/views/nodes/PDFBox.tsx
@@ -72,12 +72,7 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         !this.Document._layout_fitWidth && (this.Document._height = NumCast(this.Document._width) * (nh / nw));
         if (this.pdfUrl) {
             this._pdf = PDFBox.pdfcache.get(this.pdfUrl.url.href);
-            !this._pdf &&
-                PDFBox.pdfpromise.get(this.pdfUrl.url.href)?.then(
-                    action(pdf => {
-                        this._pdf = pdf;
-                    })
-                );
+            !this._pdf && PDFBox.pdfpromise.get(this.pdfUrl.url.href)?.then(action(pdf => (this._pdf = pdf)));
         }
     }
 
@@ -150,8 +145,8 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         this.addDocument(region);
 
         const newDiv = docViewContent.cloneNode(true) as HTMLDivElement;
-        newDiv.style.width = NumCast(this.layoutDoc._width).toString();
-        newDiv.style.height = NumCast(this.layoutDoc._height).toString();
+        newDiv.style.width = NumCast(this.layoutDoc._width).toString() + 'px';
+        newDiv.style.height = NumCast(this.layoutDoc._height).toString() + 'px';
         this.replaceCanvases(docViewContent, newDiv);
         const htmlString = this._pdfViewer?._mainCont.current && new XMLSerializer().serializeToString(newDiv);
 
@@ -409,7 +404,7 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
             this.layoutDoc._show_sidebar = nativeWidth !== this.layoutDoc._nativeWidth;
         }
     });
-    settingsPanel() {
+    @computed get settingsPanel() {
         const pageBtns = (
             <>
                 <button type="button" className="pdfBox-backBtn" key="back" title="Page Back" onPointerDown={e => e.stopPropagation()} onClick={this.backPage}>
@@ -675,7 +670,7 @@ export class PDFBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
                 <div className="pdfBox-sidebarContainer" style={{ width: `calc(100 * ${this.sidebarWidth() / this._props.PanelWidth()}%` }}>
                     {this.sidebarCollection}
                 </div>
-                {this.settingsPanel()}
+                {this.settingsPanel}
             </div>
         );
     }
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index aeabc6752..24ab38fb6 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -267,10 +267,10 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
                     annoBox.className = 'marqueeAnnotator-annotationBox';
                     const scale = this._url ? 1 : this.ScreenToLocalBoxXf().Scale;
                     // transforms the positions from screen onto the pdf div
-                    annoBox.style.top = ((rect.top - mainrect.translateY) * scale + (this._url ? this._mainCont.current.scrollTop : NumCast(this.layoutDoc.layout_scrollTop))).toString();
-                    annoBox.style.left = ((rect.left - mainrect.translateX) * scale).toString();
-                    annoBox.style.width = (rect.width * scale).toString();
-                    annoBox.style.height = (rect.height * scale).toString();
+                    annoBox.style.top = ((rect.top - mainrect.translateY) * scale + (this._url ? this._mainCont.current.scrollTop : NumCast(this.layoutDoc.layout_scrollTop))).toString() + 'px';
+                    annoBox.style.left = ((rect.left - mainrect.translateX) * scale).toString() + 'px';
+                    annoBox.style.width = (rect.width * scale).toString() + 'px';
+                    annoBox.style.height = (rect.height * scale).toString() + 'px';
                     this._annotationLayer.current && MarqueeAnnotator.previewNewAnnotation(this._savedAnnotations, this._annotationLayer.current, annoBox, 1);
                 }
             }
diff --git a/src/client/views/nodes/formattedText/DashDocView.tsx b/src/client/views/nodes/formattedText/DashDocView.tsx
index e7f2cdba8..5570ff704 100644
--- a/src/client/views/nodes/formattedText/DashDocView.tsx
+++ b/src/client/views/nodes/formattedText/DashDocView.tsx
@@ -183,7 +183,7 @@ export class DashDocView {
         this.dom = document.createElement('span');
         this.dom.style.position = 'relative';
         this.dom.style.textIndent = '0';
-        this.dom.style.width = (+node.attrs.width.toString().replace('px', '') + horizPadding).toString();
+        this.dom.style.width = (+node.attrs.width.toString().replace('px', '') + horizPadding).toString() + 'px';
         this.dom.style.height = node.attrs.height;
         this.dom.style.display = node.attrs.hidden ? 'none' : 'inline-block';
         this.dom.style.float = node.attrs.float;