diff --git a/package-lock.json b/package-lock.json
index ef2eea1..08c4a8e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "tikuidoc-tikui",
-  "version": "6.0.0",
+  "version": "7.0.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "tikuidoc-tikui",
-      "version": "6.0.0",
+      "version": "7.0.0",
       "license": "MIT",
       "devDependencies": {
         "@fontsource/montserrat": "5.0.18",
diff --git a/package.json b/package.json
index 03a72e4..531a582 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "tikuidoc-tikui",
-  "version": "6.0.0",
+  "version": "7.0.0",
   "description": "Tikui documentation",
   "main": "tikuidoc.json",
   "files": [
diff --git a/src/documentation/layout-atomic.pug b/src/documentation/layout-atomic.pug
index ced2ac3..f937e2c 100644
--- a/src/documentation/layout-atomic.pug
+++ b/src/documentation/layout-atomic.pug
@@ -4,8 +4,9 @@ block title
   title Tikui
 block body
   .tikui-template-page--header
-    .tikui-template-page--container
+    .tikui-template-page--header-container
       block header
   .tikui-template-page--body(data-navigable)
     .tikui-template-page--container
-      block content
+      .tikui-template-page--container-content
+        block content
diff --git a/src/documentation/quark/title/_title.scss b/src/documentation/quark/title/_title.scss
index 5e89978..c8b28da 100644
--- a/src/documentation/quark/title/_title.scss
+++ b/src/documentation/quark/title/_title.scss
@@ -10,6 +10,8 @@ $tikui-title-color-text: $tikui-color-text-dark !default;
   color: $tikui-title-color-text;
   font-family: $tikui-title-font-family;
   font-weight: bold;
+  hyphens: auto;
+  overflow-wrap: anywhere;
 }
 
 @import 'title-brand';
diff --git a/src/documentation/template/template-page/_template-page.scss b/src/documentation/template/template-page/_template-page.scss
index ee5e008..31c620e 100644
--- a/src/documentation/template/template-page/_template-page.scss
+++ b/src/documentation/template/template-page/_template-page.scss
@@ -13,11 +13,10 @@ $tikui-template-page-nav-width: 340px !default;
   position: fixed;
   inset: 0;
   flex-direction: column;
+  min-height: 0;
 
-  &--container {
+  &--header-container {
     box-sizing: content-box;
-    flex-basis: 0;
-    flex-grow: 1;
     margin: 0 auto;
     padding: 0 $tikui-template-page-spacing;
     width: auto;
@@ -27,17 +26,34 @@ $tikui-template-page-nav-width: 340px !default;
 
   &--body {
     display: flex;
+    flex-basis: 0;
     flex-grow: 1;
     background-color: $tikui-color-background;
-    padding: $tikui-template-page-spacing 0;
+    padding: 0;
+    min-height: 0;
     overflow: auto;
   }
 
+  &--container {
+    flex-basis: 0;
+    flex-grow: 1;
+    min-width: 0;
+    min-height: 0;
+  }
+
+  &--container-content {
+    box-sizing: content-box;
+    margin: 0 auto;
+    padding: $tikui-template-page-spacing;
+    width: auto;
+    max-width: $tikui-template-page-container-width;
+  }
+
   &--nav {
     box-sizing: content-box;
     position: sticky;
     top: 0;
-    padding: 0 $tikui-template-page-nav-padding;
+    padding: $tikui-template-page-spacing $tikui-template-page-nav-padding;
     width: $tikui-template-page-nav-width;
     overflow: auto;
   }
@@ -59,11 +75,16 @@ $tikui-template-page-nav-width: 340px !default;
   .tikui-template-page {
     overflow: auto;
 
+    &--header-container,
     &--container {
       padding: 0 $tikui-template-page-small-spacing;
       width: auto;
     }
 
+    &--container-content {
+      padding: 0;
+    }
+
     &--body {
       display: block;
       padding: $tikui-template-page-small-spacing 0;
@@ -72,6 +93,7 @@ $tikui-template-page-nav-width: 340px !default;
 
     &--nav {
       position: static;
+      padding: 0;
       width: auto;
     }
   }