# CSS to change "header" from "cards"

**URL:** <https://community.glideapps.com/t/css-to-change-header-from-cards/29054>\
**Category:** Ask for Help\
**Created:** [July 13, 2021, 8:49pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054 "2021-07-13T20:49:10Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jorge\_Hernandez](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jorge_hernandez/32/25768_2.png) [@Jorge\_Hernandez](https://community.glideapps.com/u/Jorge_Hernandez)\
**Post date:** [July 13, 2021, 8:49pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/1 "2021-07-13T20:49:11Z")

</div>

![Untitled](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/d/2/d207884845653ca914fe4639b2385506838cc0a9.png)

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [July 13, 2021, 8:54pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/2 "2021-07-13T20:54:07Z")

</div>

```auto
<pre><span><style>
[class="card-title"] { 
color: green;
}

```

_Edit: change title in cards_

---

<div class="post-metadata">

**Author:** ![Jorge\_Hernandez](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jorge_hernandez/32/25768_2.png) [@Jorge\_Hernandez](https://community.glideapps.com/u/Jorge_Hernandez)\
**Post date:** [July 13, 2021, 8:55pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/3 "2021-07-13T20:55:19Z")

</div>

Thanks!!!

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [July 13, 2021, 8:55pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/4 "2021-07-13T20:55:49Z")

</div>

Sorry, this was to Title, I’m trying to get to Header

---

<div class="post-metadata">

**Author:** ![Jorge\_Hernandez](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jorge_hernandez/32/25768_2.png) [@Jorge\_Hernandez](https://community.glideapps.com/u/Jorge_Hernandez)\
**Post date:** [July 13, 2021, 8:56pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/5 "2021-07-13T20:56:21Z")

</div>

Si jajaja. Acabo de darme cuenta. Si consigues algo agradecido de que lo compartas!

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [July 13, 2021, 8:57pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/6 "2021-07-13T20:57:49Z")

</div>

```auto
<pre><span><style>
[data-test="card-item"] .card-header {  
color: green;
}

```

![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/c/d/cdb350316efe96138f42db1561c38012dc8aa704.png)

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [July 13, 2021, 8:58pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/7 "2021-07-13T20:58:56Z")

</div>

Btw, love this  
 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/1/8/1888dee8010886f9f01c316d3f583171f90d16b9.png)

how does it look like on the phone?

---

<div class="post-metadata">

**Author:** ![Jorge\_Hernandez](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jorge_hernandez/32/25768_2.png) [@Jorge\_Hernandez](https://community.glideapps.com/u/Jorge_Hernandez)\
**Post date:** [July 13, 2021, 9:08pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/9 "2021-07-13T21:08:20Z")

</div>

It looks great and is fully functional. Here the css:

```
[id = "tabBar"] { right margin: 10px; left margin: 10px; height: 75px; bottom margin: 20px; padding: 10px; background color: white; border radius: 70px; } ![aaa|302x500](upload://mSZtfRTq5Iwg4kjtuYAzhEh1Igd.jpeg)
```

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [July 13, 2021, 9:14pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/10 "2021-07-13T21:14:25Z")

</div>

Didnt work here

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [July 13, 2021, 9:16pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/11 "2021-07-13T21:16:07Z")

</div>

> [@Jorge\_Hernandez](#):
>
> ```auto
> border radius: 70px;
> 
> ```

Oh ok, here miss a `-` between in every single tag lol **border-radius** 😁

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [July 13, 2021, 9:21pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/12 "2021-07-13T21:21:20Z")

</div>

Holy sheet 😲 this looks superb!!!

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/6/1/61bd36b3392be37a15d0ceeca5228f58157a3c1c.jpeg)

---

<div class="post-metadata">

**Author:** ![Jorge\_Hernandez](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jorge_hernandez/32/25768_2.png) [@Jorge\_Hernandez](https://community.glideapps.com/u/Jorge_Hernandez)\
**Post date:** [July 13, 2021, 9:28pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/13 "2021-07-13T21:28:54Z")

</div>

Good that it has served you!

Sale of the common in Glide and complements quite well with the design. Greetings!

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [July 13, 2021, 9:36pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/14 "2021-07-13T21:36:41Z")

</div>

Exactly! Thanks @Jorge_Hernandez !

---

<div class="post-metadata">

**Author:** ![felipe\_gonzalez](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/felipe_gonzalez/32/12049_2.png) [@felipe\_gonzalez](https://community.glideapps.com/u/felipe_gonzalez)\
**Post date:** [July 13, 2021, 9:40pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/15 "2021-07-13T21:40:10Z")

</div>

Can you share the correct code please ? 🙏

---

<div class="post-metadata">

**Author:** ![Lucas\_Pires](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/lucas_pires/32/64863_2.png) [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)\
**Post date:** [July 13, 2021, 10:11pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/16 "2021-07-13T22:11:07Z")

</div>

Welcome to our community!

```auto
<pre><span><style>
[id = "tabBar"] {
    margin: 10px 10px;
    height: 75px;
    bottom-margin: 20px;
    padding: 10px;
    border-radius: 70px;
}

```

---

<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:51pm UTC](https://community.glideapps.com/t/css-to-change-header-from-cards/29054/17 "2024-01-17T16:51:28Z")

</div>