diff --git a/internal/epub/core.go b/internal/epub/core.go
index da0ff2c..bbde21c 100644
--- a/internal/epub/core.go
+++ b/internal/epub/core.go
@@ -321,11 +321,13 @@ func (e *ePub) Write() error {
 			var content string
 			if e.AddPanelView {
 				content = e.render(textTmpl, map[string]any{
+					"Info":  e,
 					"Image": img,
 					"Manga": e.Manga,
 				})
 			} else {
 				content = e.render(textNoPanelTmpl, map[string]any{
+					"Info":  e,
 					"Image": img,
 				})
 			}
diff --git a/internal/epub/templates/content.opf.tmpl b/internal/epub/templates/content.opf.tmpl
index 730190c..511757d 100644
--- a/internal/epub/templates/content.opf.tmpl
+++ b/internal/epub/templates/content.opf.tmpl
@@ -15,7 +15,7 @@
     <meta name="primary-writing-mode" content="horizontal-{{ if $info.Manga }}rl{{ else }}lr{{ end }}"/>
     <meta property="rendition:layout">pre-paginated</meta>
     <meta property="rendition:orientation">portrait</meta>
-    <meta name="orientation-lock" content="portrait"/>
+    <meta name="rendition:spread" content="landscape"/>
 {{ if eq $info.AddPanelView true }}
     <meta name="region-mag" content="true"/>
 {{ end }}
@@ -49,9 +49,9 @@
     <itemref idref="page_part" linear="yes"/>
 {{ range .Images }}
 {{ if eq .NeedSpace true }}
-    <itemref idref="page_{{ .Id }}_sp" linear="yes"/>
+    <itemref idref="page_{{ .Id }}_sp" linear="yes" />
 {{ end }}
-    <itemref idref="page_{{ .Id }}_p{{ .Part }}" linear="yes"/>
+    <itemref idref="page_{{ .Id }}_p{{ .Part }}" linear="yes" {{ if eq .Part 1 }}properties="page-spread-left"{{ end }}{{ if eq .Part 2 }}properties="page-spread-right"{{ end }}/>
 {{ end }}
   </spine>
 </package>
diff --git a/internal/epub/templates/text.xhtml.tmpl b/internal/epub/templates/text.xhtml.tmpl
index d92b6f6..740fef9 100644
--- a/internal/epub/templates/text.xhtml.tmpl
+++ b/internal/epub/templates/text.xhtml.tmpl
@@ -5,10 +5,10 @@
     <title>Page {{ .Image.Id }}_p{{ .Image.Part}}</title>
     <link href="style.css" type="text/css" rel="stylesheet"/>
     <link href="panelview.css" type="text/css" rel="stylesheet"/>
-    <meta name="viewport" content="width={{ .Image.Width }}, height={{ .Image.Height }}"/>
+    <meta name="viewport" content="width={{ .Info.ViewWidth }}, height={{ .Info.ViewHeight }}"/>
   </head>
   <body>
-    <div>
+    <div style="width:{{ .Info.ViewWidth }}px; height:{{ .Info.ViewHeight }}px; display:flex; justify-content:center; align-items:center">
       <img style="width:{{ .Image.Width }}px; height:{{ .Image.Height }}px" src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg"/>
     </div>
     <div id="PV">
diff --git a/internal/epub/templates/textnopanel.xhtml.tmpl b/internal/epub/templates/textnopanel.xhtml.tmpl
index 0350f5a..ab19c3b 100644
--- a/internal/epub/templates/textnopanel.xhtml.tmpl
+++ b/internal/epub/templates/textnopanel.xhtml.tmpl
@@ -4,10 +4,10 @@
   <head>
     <title>Page {{ .Image.Id }}_p{{ .Image.Part}}</title>
     <link href="style.css" type="text/css" rel="stylesheet"/>
-    <meta name="viewport" content="width={{ .Image.Width }}, height={{ .Image.Height }}"/>
+    <meta name="viewport" content="width={{ .Info.ViewWidth }}, height={{ .Info.ViewHeight }}"/>
   </head>
   <body>
-    <div>
+    <div style="width:{{ .Info.ViewWidth }}px; height:{{ .Info.ViewHeight }}px; display:flex; justify-content:center; align-items:center">
       <img style="width:{{ .Image.Width }}px; height:{{ .Image.Height }}px" src="../Images/{{ .Image.Id }}_p{{ .Image.Part}}.jpg"/>
     </div>
   </body>
