<!DOCTYPE html>
<
html
>
<
head
>
<
title
>Bulma Dropdown</
title
>
<
link
rel
=
'stylesheet'
href
=
<
script
src
=
</
script
>
<
style
>
div.columns {
margin-top: 80px;
}
</
style
>
</
head
>
<
body
>
<
div
class
=
'container has-text-centered'
>
<
div
class
=
'columns is-mobile is-centered'
>
<
div
class
=
'column is-5'
>
<
div
class
=
"dropdown is-hoverable"
>
<
div
class
=
"dropdown-trigger"
>
<
button
class
=
"button"
aria-haspopup
=
"true"
aria-controls
=
"dropdown-menu"
>
<
span
>Left Aligned Todos</
span
>
<
span
class
=
"icon is-small"
>
<
i
class
=
"fas fa-angle-down"
aria-hidden
=
"true"
></
i
>
</
span
>
</
button
>
</
div
>
<
div
class
=
"dropdown-menu"
id
=
"dropdown-menu"
role
=
"menu"
>
<
div
class
=
"dropdown-content"
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Design a custom database
to store your daily activity
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Take pictures of beautiful
flowers
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Ride to a horse and write
your experience
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Go for a trip with bike
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Design a custom database
to store your daily activity
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Buy a samsung headset
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Listen music for one hour
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Go for a morning walk
</
a
>
</
div
>
</
div
>
</
div
>
</
div
>
<
div
class
=
'column is-5'
>
<
div
class
=
"dropdown is-right is-hoverable"
>
<
div
class
=
"dropdown-trigger"
>
<
button
class
=
"button"
aria-haspopup
=
"true"
aria-controls
=
"dropdown-menu"
>
<
span
>Right Aligned Todos</
span
>
<
span
class
=
"icon is-small"
>
<
i
class
=
"fas fa-angle-down"
aria-hidden
=
"true"
></
i
>
</
span
>
</
button
>
</
div
>
<
div
class
=
"dropdown-menu"
id
=
"dropdown-menu"
role
=
"menu"
>
<
div
class
=
"dropdown-content"
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Design a custom database
to store your daily activity
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Take pictures of beautiful
flowers
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Ride to a horse and write
your experience
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Go for a trip with bike
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Design a custom database
to store your daily activity
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Buy a samsung headset
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Listen music for one hour
</
a
>
<
a
href
=
"#"
class
=
"dropdown-item"
>
Go for a morning walk
</
a
>
</
div
>
</
div
>
</
div
>
</
div
>
</
div
>
</
div
>
</
body
>
</
html
>