3 files changed, 20 insertions, 20 deletions
diff --git a/server/src/routes/ui/home.rs b/server/src/routes/ui/home.rs
index 9a00532..3abc9e9 100644
--- a/server/src/routes/ui/home.rs
+++ b/server/src/routes/ui/home.rs
@@ -84,29 +84,29 @@ pub fn r_home(sess: Session, db: &State<DataAcid>) -> MyResult<DynLayoutPage> {
         title: "Home".to_string(),
         content: markup::new! {
             h2 { "Explore " @CONF.brand }
-            .hlist { ul {@for (id, node, udata) in &toplevel {
+            ul.hlist {@for (id, node, udata) in &toplevel {
                 li { @NodeCard { id, node, udata } }
-            }}}
+            }}
             @if !continue_watching.is_empty() {
                 h2 { "Continue Watching" }
-                .hlist { ul {@for (id, node, udata) in &continue_watching {
+                ul.hlist {@for (id, node, udata) in &continue_watching {
                     li { @NodeCard { id, node, udata } }
-                }}}
+                }}
             }
             @if !watchlist.is_empty() {
                 h2 { "Watchlist" }
-                .hlist { ul {@for (id, node, udata) in &watchlist {
+                ul.hlist {@for (id, node, udata) in &watchlist {
                     li { @NodeCard { id, node, udata } }
-                }}}
+                }}
             }
             h2 { "Latest Releases" }
-            .hlist { ul {@for (id, node, udata) in &latest {
+            ul.hlist {@for (id, node, udata) in &latest {
                 li { @NodeCard { id, node, udata } }
-            }}}
+            }}
             h2 { "Today's Picks" }
-            .hlist { ul {@for (id, node, udata) in &random {
+            ul.hlist {@for (id, node, udata) in &random {
                 li { @NodeCard { id, node, udata } }
-            }}}
+            }}
             p.error { "TODO: recently added" }
             p.error { "TODO: best rating" }
         },
diff --git a/server/src/routes/ui/node.rs b/server/src/routes/ui/node.rs
index 1a84dc9..59697ba 100644
--- a/server/src/routes/ui/node.rs
+++ b/server/src/routes/ui/node.rs
@@ -180,7 +180,7 @@ markup::define! {
                 @if let Some(media) = &node.media {
                     @if !media.chapters.is_empty() {
                         h2 { "Chapters" }
-                        .hlist { ul.children { @for chap in &media.chapters {
+                        ul.children.hlist { @for chap in &media.chapters {
                             @let (inl, sub) = format_chapter(chap);
                             li { .card."aspect-thumb" {
                                 .poster {
@@ -191,14 +191,14 @@ markup::define! {
                                 }
                                 .title { @sub }
                             }}
-                        }}}
+                        }}
                     }
                     @if !node_ext.people.is_empty() {
                         h2 { "Cast & Crew" }
                         @for (group, people) in &node_ext.people {
                             details[open=group==&PeopleGroup::Cast] {
                                 summary { h3 { @format!("{}", group) } }
-                                .hlist { ul.children { @for (i, pe) in people.iter().enumerate() {
+                                ul.children.hlist { @for (i, pe) in people.iter().enumerate() {
                                     li { .card."aspect-port" {
                                         .poster {
                                             a[href="#"] {
@@ -215,7 +215,7 @@ markup::define! {
                                             }
                                         }
                                     }}
-                                }}}
+                                }}
                             }
                         }
                     }
diff --git a/web/style/layout.css b/web/style/layout.css
index 7fcfee1..46fecde 100644
--- a/web/style/layout.css
+++ b/web/style/layout.css
@@ -111,14 +111,14 @@ summary h3 {
 }
 
 .hlist {
-    overflow-x: scroll;
+    overflow-x: auto;
     max-width: 100%;
+    white-space: nowrap;
 }
-.hlist ul {
-    display: table;
-}
-.hlist ul li {
-    display: table-cell;
+.hlist li {
+    display: inline-block;
+    vertical-align: top;
+    white-space: normal;
 }
 
 @media (max-width: 750px) {