# The CSS I am using these days

**URL:** <https://community.glideapps.com/t/the-css-i-am-using-these-days/26516>\
**Category:** Ask for Help\
**Created:** [May 7, 2021, 6:44am UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516 "2021-05-07T06:44:41Z")\
**Posts on this page:** 15\
**Page:** 2

<div class="post-metadata">

**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\
**Post date:** [July 10, 2021, 12:51pm UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/22 "2021-07-10T12:51:30Z")

</div>

I’ve found that the following works fine:

```auto
https://drive.google.com/uc?id={id}

```

But, I only use GDrive for images when I’m forced to.

---

<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 10, 2021, 12:53pm UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/23 "2021-07-10T12:53:35Z")

</div>

Have you tried to change the theme as I suggested to see if it works?

---

<div class="post-metadata">

**Author:** ![baremeter](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/baremeter/32/28090_2.png) [@baremeter](https://community.glideapps.com/u/baremeter)\
**Post date:** [July 10, 2021, 12:54pm UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/24 "2021-07-10T12:54:29Z")

</div>

Hi Tried but I must have something wrong - I have tried a link to Google Drive and then to an online URL !

 ![Screenshot 2021-07-10 at 14.49.41](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/2/9/29e5a3fbe96687535352c8fdc7dee0353fb4f693.png)  
Then entered a rich text element linking to the header column …

---

<div class="post-metadata">

**Author:** ![baremeter](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/baremeter/32/28090_2.png) [@baremeter](https://community.glideapps.com/u/baremeter)\
**Post date:** [July 10, 2021, 1:16pm UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/25 "2021-07-10T13:16:04Z")

</div>

Hi  
Yes I have tried but not working for me …  
Can you just check my code ?

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

} 

#app-root div[opacity='1'] {

content: ""; 

display: block;

height: 45px;

background-image: xpicture;
                               
background-size: 100px 20px;

background-repeat: no-repeat;

background-position: 55% 45%;

;}

```

(I have tried with and without " " )

**xpicture =**

> [https://image.hestia.immo/IMFFY5a315y98qLQ1IXEmTpyvk2FBnVsE-qIXnLewoA/w:200/h:150/rt:fit/aHR0cHM6Ly9jZG4uaGVzdGlhLmltbW8vaW1hZ2UvVEVOM1hQTkMvMjAyMS0wMy9ET0NBV0RXMFMyQ1cuanBlZw.jpg](https://image.hestia.immo/IMFFY5a315y98qLQ1IXEmTpyvk2FBnVsE-qIXnLewoA/w:200/h:150/rt:fit/aHR0cHM6Ly9jZG4uaGVzdGlhLmltbW8vaW1hZ2UvVEVOM1hQTkMvMjAyMS0wMy9ET0NBV0RXMFMyQ1cuanBlZw.jpg)

---

<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 10, 2021, 1:27pm UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/26 "2021-07-10T13:27:19Z")

</div>

Please try this directly in a rich text component.

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

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

.nav-bar-root {
  content: "";
  display: flex;
  background-image: url(https://image.hestia.immo/IMFFY5a315y98qLQ1IXEmTpyvk2FBnVsE-qIXnLewoA/w:200/h:150/rt:fit/aHR0cHM6Ly9jZG4uaGVzdGlhLmltbW8vaW1hZ2UvVEVOM1hQTkMvMjAyMS0wMy9ET0NBV0RXMFMyQ1cuanBlZw.jpg);
  background-size: 45px 40px;
  background-repeat: no-repeat; 
  background-position: center, center;
}

```

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

---

<div class="post-metadata">

**Author:** ![baremeter](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/baremeter/32/28090_2.png) [@baremeter](https://community.glideapps.com/u/baremeter)\
**Post date:** [July 10, 2021, 1:29pm UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/27 "2021-07-10T13:29:06Z")

</div>

OH YES - ah the brackets then !!

---

<div class="post-metadata">

**Author:** ![baremeter](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/baremeter/32/28090_2.png) [@baremeter](https://community.glideapps.com/u/baremeter)\
**Post date:** [July 12, 2021, 3:44pm UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/28 "2021-07-12T15:44:58Z")

</div>

Ok - I now have the image in situ - any way that I can center the text “BAREMETER”

 ![Screenshot 2021-07-12 at 17.44.21](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/7/0/706e1ca6446628ca5bb36715bb97ebeecbb32db1.png)

Thanks

---

<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 12, 2021, 11:37pm UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/29 "2021-07-12T23:37:36Z")

</div>

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

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

[data-test="glide-app-bar"] >div >div >div >div {
text-align: center;
}

.nav-bar-root {
  content: "";
  display: flex;
  background-image: url(https://icon-library.com/images/speedometer-icon-png/speedometer-icon-png-8.jpg);
  background-size: 45px 40px;
  background-repeat: no-repeat; 
  background-position: center, center;
}

```

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

---

<div class="post-metadata">

**Author:** ![Mike\_Greene](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/mike_greene/32/5942_2.png) [@Mike\_Greene](https://community.glideapps.com/u/Mike_Greene)\
**Post date:** [July 13, 2021, 7:01am UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/30 "2021-07-13T07:01:10Z")

</div>

Many thanks, as usual, you have been extremely helpful.  
Always knocked over by your knowledge!  
Loving Glide.

---

<div class="post-metadata">

**Author:** ![baremeter](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/baremeter/32/28090_2.png) [@baremeter](https://community.glideapps.com/u/baremeter)\
**Post date:** [July 23, 2021, 8:51am UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/31 "2021-07-23T08:51:19Z")

</div>

Hi  
Love your CSS … Can you help in reducing spacing between rows in a form ?

 ![Screenshot 2021-07-23 at 10.50.44](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/8/a/8a6d878ab2207356134f0530636cb402b4d19d69.png)

---

<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:** [August 9, 2021, 4:58pm UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/32 "2021-08-09T16:58:42Z")

</div>

Hi, I am trying to use your CSS magic with one of my image, but I keep having this white line on the top.  
Do you have any idea on how I can get rid of it?  
Many thanks

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

---

<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:** [August 9, 2021, 11:30pm UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/33 "2021-08-09T23:30:00Z")

</div>

Can you show me the list of components you have on that screen? Is your rich text on top of the image?

---

<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:** [August 10, 2021, 2:57am UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/34 "2021-08-10T02:57:28Z")

</div>

This is only in the builder @AyS_0908

Btw, happy birthday 😁

---

<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:** [August 10, 2021, 5:59am UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/35 "2021-08-10T05:59:52Z")

</div>

Thanks @Lucas_Pires @ThinhDinh.  
You’re both right: my CSS was at the end of the builder + the line disappears on the live app!

Thanks!

---

<div class="post-metadata">

**Author:** ![Nadir\_Abdelrahman\_MD](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nadir_abdelrahman_md/32/5237_2.png) [@Nadir\_Abdelrahman\_MD](https://community.glideapps.com/u/Nadir_Abdelrahman_MD)\
**Post date:** [September 28, 2021, 2:40am UTC](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516/36 "2021-09-28T02:40:48Z")

</div>

This is really great.

[Previous page](https://community.glideapps.com/t/the-css-i-am-using-these-days/26516.md?page=1)
