# \[ISSUE\]? why are some of the dashboard buttons in the foreground?
**URL:** https://discourse.nodered.org/t/issue-why-are-some-of-the-dashboard-buttons-in-the-foreground/20482
**Category:** Dashboard
**Created:** [17 January 2020 08:32 UTC](https://discourse.nodered.org/t/issue-why-are-some-of-the-dashboard-buttons-in-the-foreground/20482 "2020-01-17T08:32:18Z")
**Posts on this page:** 7
**Page:** 1
### Author:  [@SuperNinja](https://discourse.nodered.org/u/SuperNinja)
#### Post date: [17 January 2020 08:32 UTC](https://discourse.nodered.org/t/issue-why-are-some-of-the-dashboard-buttons-in-the-foreground/20482/1 "2020-01-17T08:32:18Z")
**This is the dashboard :**
**I clic on the picture to enlarge** ( it's a UI\_template node with this html code : [https://www.w3schools.com/howto/howto\_css\_modal\_images.asp](https://www.w3schools.com/howto/howto_css_modal_images.asp)) :
**Why some buttons are in second layer while other are in first layer ?**
Help is appreciate, thanks
Chris
---
### Author:  [@bakman2](https://discourse.nodered.org/u/bakman2)
#### Post date: [17 January 2020 08:55 UTC](https://discourse.nodered.org/t/issue-why-are-some-of-the-dashboard-buttons-in-the-foreground/20482/2 "2020-01-17T08:55:50Z")
If you use that actual code as shown in the link, try modifying the css:
```auto
.modal {
...
z-index: 1
```
to:
```auto
z-index: 100
```
If that doesn't work, you need to determine what the z-index of the buttons are (right click on one -\> inspect element and check the properties), the modal should have a higher z-index to cover them.
---
### Author:  [@SuperNinja](https://discourse.nodered.org/u/SuperNinja)
#### Post date: [17 January 2020 08:59 UTC](https://discourse.nodered.org/t/issue-why-are-some-of-the-dashboard-buttons-in-the-foreground/20482/3 "2020-01-17T08:59:32Z")
yeah ! very good :
Thanks @bakman2
---
### Author:  [@SuperNinja](https://discourse.nodered.org/u/SuperNinja)
#### Post date: [17 January 2020 09:08 UTC](https://discourse.nodered.org/t/issue-why-are-some-of-the-dashboard-buttons-in-the-foreground/20482/4 "2020-01-17T09:08:24Z")
One last question @bakman2 : I would like to close this "enlarged image" window by clicking outside the image (in the black part), and not just on the cross. What would be the code to add to close the modal?
---
### Author:  [@bakman2](https://discourse.nodered.org/u/bakman2)
#### Post date: [17 January 2020 09:13 UTC](https://discourse.nodered.org/t/issue-why-are-some-of-the-dashboard-buttons-in-the-foreground/20482/5 "2020-01-17T09:13:15Z")
You could try to add this to the javascript:
```auto
modal.onclick = function() {
modal.style.display = "none";
}
```
---
### Author:  [@SuperNinja](https://discourse.nodered.org/u/SuperNinja)
#### Post date: [17 January 2020 09:24 UTC](https://discourse.nodered.org/t/issue-why-are-some-of-the-dashboard-buttons-in-the-foreground/20482/6 "2020-01-17T09:24:18Z")
whoow : nice !! Is it possible that the click is active only outside the image as in this example [https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css\_modal\_close](https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_modal_close)
and it will be perfect 🙂
---
### Author:  [@SuperNinja](https://discourse.nodered.org/u/SuperNinja)
#### Post date: [17 January 2020 09:27 UTC](https://discourse.nodered.org/t/issue-why-are-some-of-the-dashboard-buttons-in-the-foreground/20482/7 "2020-01-17T09:27:10Z")
i found :
```auto
// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
```
It's ok thanks @bakman2