# CSS to hide tab title?

**URL:** <https://community.glideapps.com/t/css-to-hide-tab-title/25099>\
**Category:** Ask for Help\
**Created:** [April 3, 2021, 8:52pm UTC](https://community.glideapps.com/t/css-to-hide-tab-title/25099 "2021-04-03T20:52:31Z")\
**Posts on this page:** 9\
**Page:** 1

<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:** [April 3, 2021, 8:52pm UTC](https://community.glideapps.com/t/css-to-hide-tab-title/25099/1 "2021-04-03T20:52:31Z")

</div>

@ThinhDinh @Lucas_Pires

Anyone able to hide the tab title using reliable CSS? It doesn’t have a named class.

---

<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:** [April 3, 2021, 9:58pm UTC](https://community.glideapps.com/t/css-to-hide-tab-title/25099/2 "2021-04-03T21:58:30Z")

</div>

```
<pre><span><style>
#app-root [opacity='1'] {
  color: transparent; 
}
```

---

<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:** [April 3, 2021, 10:47pm UTC](https://community.glideapps.com/t/css-to-hide-tab-title/25099/3 "2021-04-03T22:47:29Z")

</div>

So smart.

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [April 3, 2021, 11:04pm UTC](https://community.glideapps.com/t/css-to-hide-tab-title/25099/4 "2021-04-03T23:04:47Z")

</div>

This was the first one I learned from you. Nowadays I usually use this to make images going up all the way to the top of the screen. Thank you.

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [April 3, 2021, 11:06pm UTC](https://community.glideapps.com/t/css-to-hide-tab-title/25099/5 "2021-04-03T23:06:49Z")

</div>

![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/0/3/03edf69b52dd0cd7ff216bc49732d083ed5dc3b8.jpeg)

Something like this, but I’m still finding a way to hide/show the CSS based on the scrolling position. For example if the user is at the top ideally I would use a white color for the back button and the pencil so it can be clearer. When the user scrolls down I want to make it black. I already have the CSS to change those colors but not sure how to get the scrolling position in.

```
<div><div>
<style>
[data-test="glide-app-bar"] >* {
backdrop-filter: blur(2px);
background:transparent;
-webkit-backdrop-filter: blur(2px);
}
#app-root div[opacity='1'] {
  color: transparent; 
}
[data-test="nav-button-Edit"] svg {
fill: black;
}
[data-test="back-button"] svg {
fill: black;
}
[data-test="back-button"] >* {
color: black;
}
[id="app-root"] >div >svg {
fill: black;
}
```

---

<div class="post-metadata">

**Author:** ![AyS\_0908](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/ays_0908/32/27349_2.png) [@AyS\_0908](https://community.glideapps.com/u/AyS_0908)\
**Post date:** [July 30, 2021, 8:32am UTC](https://community.glideapps.com/t/css-to-hide-tab-title/25099/6 "2021-07-30T08:32:23Z")

</div>

Hi @Lucas_Pires, thank you.  
Do you just put it in a richtext component? I don’t manage to activate it…

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/4/7/479b0ea130398ed19664bd5bc161d96fc88cc387.png)

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [July 30, 2021, 9:02am UTC](https://community.glideapps.com/t/css-to-hide-tab-title/25099/7 "2021-07-30T09:02:11Z")

</div>

That code has been deprecated.

Please try this.

```auto
<pre><span><style>

[data-test="nav-bar"] >div +* {
  color: transparent !important; 
}

```

---

<div class="post-metadata">

**Author:** ![AyS\_0908](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/ays_0908/32/27349_2.png) [@AyS\_0908](https://community.glideapps.com/u/AyS_0908)\
**Post date:** [July 30, 2021, 9:18am UTC](https://community.glideapps.com/t/css-to-hide-tab-title/25099/8 "2021-07-30T09:18:07Z")

</div>

Great, 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 30, 2021, 12:11pm UTC](https://community.glideapps.com/t/css-to-hide-tab-title/25099/9 "2021-07-30T12:11:19Z")

</div>

This ☝🏼