# Listbox header transparency

**URL:** <https://forum.xojo.com/t/listbox-header-transparency/71256>\
**Category:** Web\
**Created:** [July 20, 2022, 12:57pm UTC](https://forum.xojo.com/t/listbox-header-transparency/71256 "2022-07-20T12:57:19Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Samiul\_Hassan](https://forum.xojo.com/letter_avatar_proxy/v4/letter/s/c57346/32.png) [@Samiul\_Hassan](https://forum.xojo.com/u/Samiul_Hassan)\
**Post date:** [July 20, 2022, 12:57pm UTC](https://forum.xojo.com/t/listbox-header-transparency/71256/1 "2022-07-20T12:57:19Z")

</div>

Hi,  
I have a SearchField in a web app. Upon clicking to search, a Listbox appears below it showing results (by setting visible property to true). The problem is that the Listbox header is partially transparent and so I can see another text field that it overlaps. Can I easily make the Listbox header opaque?  
I wanted to avoid the situation of making other controls hidden when the ListBox is visible as this doesn’t seem like an elegant solution and perhaps there’s a better solution.

---

<div class="post-metadata">

**Author:** ![Tom\_Dixon](https://forum.xojo.com/user_avatar/forum.xojo.com/tom_dixon/32/605_2.png) [@Tom\_Dixon](https://forum.xojo.com/u/Tom_Dixon)\
**Post date:** [July 20, 2022, 1:13pm UTC](https://forum.xojo.com/t/listbox-header-transparency/71256/2 "2022-07-20T13:13:07Z")

</div>

Under App in Web Settings you can set the Table Style to have a background color by adding the following to the HTML Header

```auto
<style>
.table th {
    background-color: white;
   }
</style>

```

This will globally set the background to all table headers to white. There are ways to set up a specific table type style that you can invoke with a JavaScript like discussed here: [Another WebListbox CSS Challenge - Different Header Background?](https://forum.xojo.com/t/another-weblistbox-css-challenge-different-header-background/70988)

---

<div class="post-metadata">

**Author:** ![Samiul\_Hassan](https://forum.xojo.com/letter_avatar_proxy/v4/letter/s/c57346/32.png) [@Samiul\_Hassan](https://forum.xojo.com/u/Samiul_Hassan)\
**Post date:** [July 20, 2022, 4:51pm UTC](https://forum.xojo.com/t/listbox-header-transparency/71256/3 "2022-07-20T16:51:32Z")

</div>

Fantastic that works great thanks!

---

<div class="post-metadata">

**Author:** ![Samiul\_Hassan](https://forum.xojo.com/letter_avatar_proxy/v4/letter/s/c57346/32.png) [@Samiul\_Hassan](https://forum.xojo.com/u/Samiul_Hassan)\
**Post date:** [July 29, 2022, 3:38pm UTC](https://forum.xojo.com/t/listbox-header-transparency/71256/4 "2022-07-29T15:38:33Z")

</div>

@Tom_Dixon I have just noticed the listbox scroll bar is still transparent to other controls behind it. Is there a way to fix this?

---

<div class="post-metadata">

**Author:** ![Tom\_Dixon](https://forum.xojo.com/user_avatar/forum.xojo.com/tom_dixon/32/605_2.png) [@Tom\_Dixon](https://forum.xojo.com/u/Tom_Dixon)\
**Post date:** [July 29, 2022, 5:01pm UTC](https://forum.xojo.com/t/listbox-header-transparency/71256/5 "2022-07-29T17:01:10Z")

</div>

> [@Samiul\_Hassan](#):
>
> I have just noticed the listbox scroll bar is still transparent to other controls behind it. Is there a way to fix this?

I’m not 100% sure of the exact syntax needed but this post might be helpful: [Another WebListbox CSS Challenge - Different Header Background? - #3 by Anthony\_G\_Cyphers](https://forum.xojo.com/t/another-weblistbox-css-challenge-different-header-background/70988/3).