Open In App

Bulma Delete Combinations

Improve
Improve
Like Article
Like
Save
Share
Report

Bulma is a free and open-source CSS framework that ships with premade components and elements. It makes the development of websites very fast as you do not have to style everything from scratch.

The Bulma Delete element can be used with other elements to make different User Interfaces. Bulma itself uses it inside tags, notifications, and messages.

Syntax:

<span class="tag is-danger">
    Operation Unsuccessful
    <button class="delete"></button>
</span>

Example: The Below example illustrates how the delete element is used in combination with other elements.

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>Bulma Delete Combinations</title>
    <link rel="stylesheet" href=
    <style>
        div.container>div {
            margin: 20px;
        }
    </style>
</head>
  
<body class="has-text-centered">
    <h1 class="is-size-2 has-text-success">GeeksforGeeks</h1>
    <b>Bulma Delete Combinations</b>
    <div class="container">
        <div>
            <span class="tag is-danger">
                Operation Unsuccessful
                <button class="delete"></button>
            </span>
        </div>
  
        <div class="notification is-success">
            <button class="delete"></button>
            GeeksforGeeks is a computer science portal for geeks.
            It provides articles and videos on different
            topics like Data Structures, Algorithms, DBMS, 
              Computer Network etc.
        </div>
  
    </div>
</body>
  
</html>


Output:

Bulma Delete Combinations

Reference: https://bulma.io/documentation/elements/delete/#combinations



Last Updated : 20 Jan, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads