dialog

The dialog HTML 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

Global

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);
}

Syntax

HTML

Attributes

CSS

Examples

open

CSS

Links