# CSS MessageBox

**URL:** <https://community.glideapps.com/t/css-messagebox/26741>\
**Category:** Community Resources\
**Created:** [May 13, 2021, 10:08am UTC](https://community.glideapps.com/t/css-messagebox/26741 "2021-05-13T10:08:45Z")\
**Posts on this page:** 1\
**Showing post:** 85

<div class="post-metadata">

**Author:** ![MIKAHEL](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/mikahel/32/25039_2.png) [@MIKAHEL](https://community.glideapps.com/u/MIKAHEL)\
**Post date:** [August 17, 2021, 4:58am UTC](https://community.glideapps.com/t/css-messagebox/26741/85 "2021-08-17T04:58:15Z")

</div>

![finally](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/4/b/4b7cf1ba96a3fa297031a357124c096a46efdbd7.jpeg)  
thank you so much!

and this is the applied code (if anyone may need it):

```auto
<!-- Blurry -->
<a style="top:200px;">
<div style="
position:fixed;
top:0px;
left:-5%;
margin: 0%; 
padding: 100%;
background-color: rgb(0 0 0 / 50%); 
backdrop-filter: blur(4px);">
</style></div></a>

<!-- Box -->
<div style =" position: fixed;
top: 280px; 
width: 94%;
max-width:680px;
opacity: 1;
margin-left: -5px;
height:210px;
background: white;
border-radius: 10px;
padding-top: 1%;
padding-left: 7%;
padding-right: 7%;
box-shadow: rgb(0 0 0 / 15%) 0px 4px 10px;
text-align: center;
z-index:0 !important;"
>

<!-- Text-->
<br>
<h2><font color=#000>メールを追加</h2>
Follow us!

<pre><span><style>

[data-test="app-button-view"] { 
position: fixed;
top: 438px; 
margin-left: calc(5% - 10px);
width: 40%;
max-width: 200px;
}

[data-test="app-text-field"] { 
position: fixed;
top: 380px;margin-left: calc(8% - 10px);
width: 100%;
max-width: 400px; 
}

.fab-target >* {
display:none;
}

</style></span></pre>

```

---

_[View the full topic](https://community.glideapps.com/t/css-messagebox/26741)._