diff --git a/client/webserver/site/src/html/bodybuilder.tmpl b/client/webserver/site/src/html/bodybuilder.tmpl
index a0990a8066..195311dee6 100644
--- a/client/webserver/site/src/html/bodybuilder.tmpl
+++ b/client/webserver/site/src/html/bodybuilder.tmpl
@@ -9,7 +9,7 @@
   <link rel="icon" href="/img/favicon.png?v=AK4XS4">
   <meta name="description" content="Decred DEX Client Web Portal">
   <title>{{.Title}}</title>
-  <link href="/css/style.css?v=db6f9378|14dcf2aa" rel="stylesheet">
+  <link href="/css/style.css?v=340226b5|955d7451" rel="stylesheet">
 </head>
 <body {{if .UserInfo.DarkMode}} class="dark"{{end}}>
   <div class="popup-notes" id="popupNotes">
@@ -103,7 +103,7 @@
 {{end}}
 
 {{define "bottom"}}
-<script src="/js/entry.js?v=b2ea5069|46b9d8f1"></script>
+<script src="/js/entry.js?v=f6df0d90|c05a9a94"></script>
 </body>
 </html>
 {{end}}
diff --git a/client/webserver/site/src/js/markets.ts b/client/webserver/site/src/js/markets.ts
index c21204b6f6..249cb55d71 100644
--- a/client/webserver/site/src/js/markets.ts
+++ b/client/webserver/site/src/js/markets.ts
@@ -1445,25 +1445,32 @@ export default class MarketsPage extends BasePage {
   }
 
   async loadUserOrders () {
-    const market = this.market
+    const { base: b, quote: q, dex: { host }, cfg: { name: mktID } } = this.market
     for (const oid in this.metaOrders) delete this.metaOrders[oid]
-    if (!market.base || !market.quote) return this.resolveActiveOrders([]) // unsupported asset
+    if (!b || !q) return this.resolveUserOrders([]) // unsupported asset
+    const activeOrders = app().orders(host, mktID)
+    if (activeOrders.length >= maxUserOrdersShown) return this.resolveUserOrders(activeOrders)
     const filter: OrderFilter = {
-      hosts: [market.dex.host],
-      market: { baseID: market.base.id, quoteID: market.quote.id },
+      hosts: [host],
+      market: { baseID: b.id, quoteID: q.id },
       n: this.maxUserOrderCount()
     }
     const res = await postJSON('/api/orders', filter)
-    return this.resolveActiveOrders(res.orders || [])
+    const orders = res.orders || []
+    // Make sure all active orders are in there. The /orders API sorts by time,
+    // so if there is are 10 cancelled/executed orders newer than an old active
+    // order, the active order wouldn't be included in the result.
+    for (const activeOrd of activeOrders) if (!orders.some((dbOrd: Order) => dbOrd.id === activeOrd.id)) orders.push(activeOrd)
+    return this.resolveUserOrders(res.orders || [])
   }
 
   /* refreshActiveOrders refreshes the user's active order list. */
   refreshActiveOrders () {
     const orders = app().orders(this.market.dex.host, marketID(this.market.baseCfg.symbol, this.market.quoteCfg.symbol))
-    return this.resolveActiveOrders(orders)
+    return this.resolveUserOrders(orders)
   }
 
-  resolveActiveOrders (orders: Order[]) {
+  resolveUserOrders (orders: Order[]) {
     const { page, metaOrders, market } = this
     const cfg = market.cfg
 
