<!DOCTYPE html>
<
html
>
<
head
>
<
title
>Bulma Form Icons</
title
>
<
link
rel
=
'stylesheet'
href
=
<
link
rel
=
"stylesheet"
href
=
<
style
>
form{
margin-top: 25px;
}
</
style
>
</
head
>
<
body
class
=
"has-text-centered"
>
<
h1
class
=
"is-size-2 has-text-success"
>GeeksforGeeks</
h1
>
<
p
><
b
>Bulma Form Icons</
b
></
p
>
<
div
class
=
"container is-fluid"
>
<
form
>
<
div
class
=
"field"
>
<
p
class
=
"control has-icons-left"
>
<
input
class
=
"input"
type
=
"text"
placeholder
=
"Icon On Left"
>
<
span
class
=
"icon is-left"
>
<
i
class
=
"fas fa-user"
></
i
>
</
span
>
</
p
>
</
div
>
<
div
class
=
"field"
>
<
p
class
=
"control has-icons-right"
>
<
input
class
=
"input"
type
=
"text"
placeholder
=
"Icon On Right"
>
<
span
class
=
"icon is-right"
>
<
i
class
=
"fas fa-list"
></
i
>
</
span
>
</
p
>
</
div
>
<
div
class
=
"field"
>
<
p
class
=
"control has-icons-left has-icons-right"
>
<
input
class
=
"input"
type
=
"text"
placeholder
=
"Icon On Both Sides"
>
<
span
class
=
"icon is-left"
>
<
i
class
=
"fas fa-home"
></
i
>
</
span
>
<
span
class
=
"icon is-right"
>
<
i
class
=
"fas fa-key"
></
i
>
</
span
>
</
p
>
</
div
>
</
form
>
</
div
>
</
body
>
</
html
>