# CSS card list Scoreboard style

**URL:** <https://community.glideapps.com/t/css-card-list-scoreboard-style/56089>\
**Category:** Ask for Help\
**Created:** [December 27, 2022, 4:48pm UTC](https://community.glideapps.com/t/css-card-list-scoreboard-style/56089 "2022-12-27T16:48:02Z")\
**Posts on this page:** 6\
**Page:** 2

<div class="post-metadata">

**Author:** ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)\
**Post date:** [January 8, 2023, 3:39am UTC](https://community.glideapps.com/t/css-card-list-scoreboard-style/56089/22 "2023-01-08T03:39:30Z")

</div>

Ya…but you used transformed a card component where the data lives on two rows. I’m looking for a solution where the data lives on the same row…so I can’t use a collection. I’m also using Pages…so I need custom HTML with inline CSS most likely.

---

<div class="post-metadata">

**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/96552_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\
**Post date:** [January 8, 2023, 3:42am UTC](https://community.glideapps.com/t/css-card-list-scoreboard-style/56089/23 "2023-01-08T03:42:32Z")

</div>

If you made that top row a 3 column HTML table, you could eliminate the text wrapping, yeah?

---

<div class="post-metadata">

**Author:** ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)\
**Post date:** [January 8, 2023, 3:53am UTC](https://community.glideapps.com/t/css-card-list-scoreboard-style/56089/24 "2023-01-08T03:53:36Z")

</div>

Probably. I’ll try that over a flexbox.

---

<div class="post-metadata">

**Author:** ![Alexander\_Rubino](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/alexander_rubino/32/48638_2.png) [@Alexander\_Rubino](https://community.glideapps.com/u/Alexander_Rubino)\
**Post date:** [January 8, 2023, 4:02pm UTC](https://community.glideapps.com/t/css-card-list-scoreboard-style/56089/25 "2023-01-08T16:02:24Z")

</div>

Please post your final result when you get there

---

<div class="post-metadata">

**Author:** ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)\
**Post date:** [January 9, 2023, 2:05am UTC](https://community.glideapps.com/t/css-card-list-scoreboard-style/56089/26 "2023-01-09T02:05:31Z")

</div>

This doesn’t look half bad:

 ![CleanShot 2023-01-08 at 21.02.19@2x](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/b/6/b6afb752692670c8d98bf5ecd8fbaebe91e5f3ae.jpeg)

```auto
<table class="tg" style=" width:100%;text-align:center;">
<thead>
  <tr>
    <td style="width:25%;"><img src="[i1]" width="75px;"></td>
    <td style="width:50%;font-size:34px; font-weight:700;">[vs] - [hs]</td>
    <td style="width:25%;"><img src="[i2]" width="75px;"></td>
  </tr>
</thead>
</table>

```

![CleanShot 2023-01-08 at 21.05.12@2x](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/3/c/3cb68d26fee674cc0567ce3d6a9a3f0e2c088ec6.png)

 ![CleanShot 2023-01-08 at 21.05.50@2x](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/f/5/f54247826767a8d5830c83b8ea2d21f3dcab9c7f.jpeg)

---

<div class="post-metadata">

**Author:** ![NoCodeAndy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nocodeandy/32/62530_2.png) [@NoCodeAndy](https://community.glideapps.com/u/NoCodeAndy)\
**Post date:** [January 17, 2024, 4:49pm UTC](https://community.glideapps.com/t/css-card-list-scoreboard-style/56089/27 "2024-01-17T16:49:12Z")

</div>

Closed on January 17, 2024, 4:49pm UTC



[Previous page](https://community.glideapps.com/t/css-card-list-scoreboard-style/56089.md?page=1)