<!DOCTYPE html>
<
html
lang
=
"en"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
meta
http-equiv
=
"X-UA-Compatible"
content
=
"IE=edge"
>
<
meta
name
=
"viewport"
content
=
"width=device-width, initial-scale=1.0"
>
<
title
>Input group Rounded | Blaze UI</
title
>
<
link
rel
=
"stylesheet"
href
=
<
style
>
html{
font-family:sans-serif;
}
</
style
>
</
head
>
<
body
>
<
div
class
=
"u-centered"
>
<
h2
style
=
"color:green;"
>GeeksforGeeks</
h2
>
<
h3
>Input Group Rounded - Blaze UI</
h3
>
</
div
>
<
div
class
=
"u-window-box-xlarge"
>
<
h4
>Left Rounded</
h4
>
<
div
class
=
"c-input-group c-input-group--rounded-left"
>
<
div
class
=
"o-field"
>
<
input
class
=
"c-field"
name
=
"lInput"
placeholder
=
"Left Text Input"
>
</
div
>
<
div
class
=
"o-field"
>
<
input
class
=
"c-field"
name
=
"mInput"
placeholder
=
"Middle Text Input"
>
</
div
>
<
div
class
=
"o-field"
>
<
input
class
=
"c-field"
name
=
"mInput"
placeholder
=
"Right Text Input"
>
</
div
>
</
div
>
</
div
>
<
div
class
=
"u-window-box-xlarge"
>
<
h4
>Right Rounded</
h4
>
<
div
class
=
"c-input-group c-input-group--rounded-right"
>
<
div
class
=
"o-field"
>
<
input
class
=
"c-field"
name
=
"lInput"
placeholder
=
"Left Text Input"
>
</
div
>
<
div
class
=
"o-field"
>
<
input
class
=
"c-field"
name
=
"mInput"
placeholder
=
"Middle Text Input"
>
</
div
>
<
div
class
=
"o-field"
>
<
input
class
=
"c-field"
name
=
"mInput"
placeholder
=
"Right Text Input"
>
</
div
>
</
div
>
</
div
>
</
body
>
</
html
>