DIALOG
The dialog element represents a part of an application that a user interacts with to perform a task.
SYNTAX
HTML
<dialog attribute-name="attribute-value"></dialog>
ATTRIBUTES
| NAME | VALUE | DESCRIPTION |
|---|---|---|
| open | open | empty | element is active and the user can interact with it |
CSS
dialog {
background: white;
border: solid;
color: black;
height: fit-content;
left: 0;
margin: auto;
padding: 1em;
position: absolute;
right: 0;
width: fit-content;
}
dialog:not([open]) {
display: none;
}
dialog::backdrop {
background: rgba(0,0,0,0.1);
}