```
Change: `background-color` and `padding` to change the size
> Tip: put rich text as first component
---
### Author:  [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)
#### Post date: [September 26, 2020, 10:04pm UTC](https://community.glideapps.com/t/create-background-with-css/16403/13 "2020-09-26T22:04:36Z")
And where is the tab name, its a nav-bar. Is it possible to change? yes.
But we gotta use advanced CSS to change it
---
### Author:  [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)
#### Post date: [September 26, 2020, 10:06pm UTC](https://community.glideapps.com/t/create-background-with-css/16403/14 "2020-09-26T22:06:01Z")
Right. Create a rich text box as the top component
In the box, use CSS to set the position as absolute. Then you can adjust the size, background color and z index of the box to achieve your mock-up.
---
### Author:  [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)
#### Post date: [September 26, 2020, 10:06pm UTC](https://community.glideapps.com/t/create-background-with-css/16403/15 "2020-09-26T22:06:24Z")
Perfect
---
### Author:  [@Jen\_NYCP](https://community.glideapps.com/u/Jen_NYCP)
#### Post date: [September 26, 2020, 10:43pm UTC](https://community.glideapps.com/t/create-background-with-css/16403/16 "2020-09-26T22:43:02Z")
Oh nice!! Thanks! Before seeing this, I ended up using the code Lucas mentioned here, it almost works, but…
> [@Component background color](https://community.glideapps.com/t/component-background-color/10712/4):
>
> @adelhammoud a lil’ trick may help you
>
> In Data editor, create a Template column and add this code:
>
> ```auto
>
> 
>
> ```
>
> Replace **URL** to the Pic column. In the screen you wanna add this background, add a Rich Text component and the result will something like this 👇🏼
>
> (The code is not 100%, but when I improve it, it’s cool to fit the image in the whole screen)
it shows up differently on the front end from what I see in the builder. Also trying to get the blue background all the way to the top.
 
---
### Author:  [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)
#### Post date: [September 27, 2020, 6:20am UTC](https://community.glideapps.com/t/create-background-with-css/16403/17 "2020-09-27T06:20:35Z")
> [@Lucas\_Pires](#):
>
> Tip: put rich text as first component
As I said here…
---
### Author:  [@Jen\_NYCP](https://community.glideapps.com/u/Jen_NYCP)
#### Post date: [September 27, 2020, 12:06pm UTC](https://community.glideapps.com/t/create-background-with-css/16403/18 "2020-09-27T12:06:15Z")
Is it at the very top. The first block. You can see in the first one on the builder shows it correctly, but on the user end it does not.
---
### Author:  [@Lucas\_Pires](https://community.glideapps.com/u/Lucas_Pires)
#### Post date: [September 27, 2020, 7:40pm UTC](https://community.glideapps.com/t/create-background-with-css/16403/19 "2020-09-27T19:40:54Z")
Have you change `top` in the code? This must be `top:0px;`
---
### Author:  [@Jen\_NYCP](https://community.glideapps.com/u/Jen_NYCP)
#### Post date: [September 28, 2020, 4:14pm UTC](https://community.glideapps.com/t/create-background-with-css/16403/20 "2020-09-28T16:14:22Z")
Yess that worked. Thank you!!
[Next page](https://community.glideapps.com/t/create-background-with-css/16403.md?page=2)