limit table width in Chrome browser

Build is currently broken due to
parcel-bundler/parcel#5164

package.json

@@ -17,22 +17,22 @@
     "hashquery": "^1.0.0",
     "js-cookie": "^2.2.1",
     "mnemonist": "^0.38.0",
-    "preact": "^10.4.5",
+    "preact": "^10.4.8",
     "pretty-ms": "^7.0.0",
     "purecss": "^2.0.3",
     "qs": "^6.9.4",
-    "tslib": "^2.0.0"
+    "tslib": "^2.0.1"
   },
   "devDependencies": {
     "@kenpb/parcel-plugin-ifdef": "^1.1.2",
     "@types/classnames": "^2.2.10",
     "@types/js-cookie": "^2.2.6",
-    "@types/node": "^14.0.14",
-    "@types/qs": "^6.9.3",
+    "@types/node": "^14.11.1",
+    "@types/qs": "^6.9.5",
     "@yoursunny/xo-config": "^0.33.0",
-    "execa": "^4.0.2",
+    "execa": "^4.0.3",
     "parcel-bundler": "^1.12.4",
-    "typescript": "^3.9.6"
+    "typescript": "^4.0.3"
   },
   "browserslist": [
     "since 2017-06"

src/components/face/detail.tsx

@@ -71,7 +71,12 @@ function FaceFlags({ flags }: { flags: FaceFlag[] }) {
 function FaceRoutes({ routes }: { routes: Route[] }) {
   const gotoRib = useContext(GotoRibContext);
   return (
-    <table class="pure-table pure-table-bordered">
+    <table class="pure-table pure-table-bordered" style="table-layout:fixed; word-break:break-all;">
+      <colgroup>
+        <col style="width:60%;"/>
+        <col style="width:20%;"/>
+        <col style="width:20%;"/>
+      </colgroup>
       <thead>
         <tr>
           <th>name</th>

src/components/rib/table.tsx

@@ -16,7 +16,11 @@ export function RibTable({ selected, filter }: Props) {
   const { rib } = useContext(NfdStatusContext);
   const gotoRib = useContext(GotoRibContext);
   return (
-    <table class="pure-table pure-table-bordered">
+    <table class="pure-table pure-table-bordered" style="table-layout:fixed; word-break:break-all;">
+      <colgroup>
+        <col style="width:80%;"/>
+        <col style="width:20%;"/>
+      </colgroup>
       <thead>
         <tr>
           <th>prefix</th>