Metronic | Input Groups

Hi, Sean S

### Input Groups

Actions

### Basic Example

Use any icon in input group from Flaticon, Fontawesome 5, Lineawesome or Socicons icons.
Left Addon
@
Some help content goes here
Right Addon
@example.com
Joint Addons
$ 0.00
Left & Right Addons
#
px

### With Icons

Easily extend form controls by adding text, buttons, icons, or button groups on either side of textual.
Left Addon
Some help content goes here
Right Addon
Joint Addons
$
Both Addons

### Sizing

Add the relative form sizing classes to the `.input-group` itself and contents within will automatically resize.
Large Input Group
Some help content goes here
Large Input Group
0.00
Small Input Group
Small Input Group

### Input Icons

Use custom icon input component to place icon inside input control.
Left Icon Input
Some help content goes here
Right Icon Input
Some help content goes here
Large Size
Some help content goes here
Small Size
Some help content goes here

### Checkboxes and Radio addons

Place any checkbox or radio option within an input group’s addon instead of text.
Left Checkbox Addon
$
Right Checkbox Addon
$
Right & Left Checkbox Addon
Left Radio Addon
$
Right Radio Addon
$
Right & Left Radio Addon

### Button Addons

Buttons in input groups must wrapped in a `.input-group-prepend` or `.input-group-append` for proper alignment and sizing. This is required due to default browser styles that cannot be overridden.
Left Addon Button
Right Addon Button
Left & Right Addon Button
Left Addon Button
Right Addon Button
Left & Right Addon Button

### Buttons With Dropdowns

The example form below demonstrates common HTML form elements that receive updated styles from Bootstrap with additional classes.
Left Button Dropdown
Some help content goes here
Right Button Dropdown
Some help content goes here
Left & Right Button Dropdown
Some help content goes here
New order has been received
2 hrs ago
New customer is registered
3 hrs ago
Application has been approved
3 hrs ago
New file has been uploaded
5 hrs ago
New user feedback received
8 hrs ago
System reboot has been successfully completed
12 hrs ago
New order has been placed
15 hrs ago
Company meeting canceled
19 hrs ago
New report has been received
23 hrs ago
Finance report has been generated
25 hrs ago
New customer comment recieved
2 days ago
New customer is registered
3 days ago
5 new user generated report
Reports based on sales
2 new items submited
by Grog John
79 PSD files generated
Reports based on sales
$2900 worth producucts sold
Total 234 items
4.5h-avarage response time
Fostest is Barry
Database server is down
10 mins ago
System report has been generated
Fostest is Barry
4.5h-avarage response time
Fostest is Barry
Customer Care
Enable Notifications:
Enable Case Tracking:
Support Portal:
Reports
Generate Reports:
Enable Report Export:
Allow Data Collection:
Memebers
Enable Member singup:
Allow User Feedbacks:
Enable Customer Portal:

### Select A Demo

Demo 1
Default RTL Version
Demo 2
Default RTL Version
Demo 3
Default RTL Version
Demo 4
Default RTL Version
Demo 5
Default RTL Version
Demo 6
Default RTL Version
Demo 7
Default RTL Version
Demo 8
Default RTL Version
Demo 9
Default RTL Version
Demo 10
Default RTL Version
Demo 11
Default RTL Version
Demo 12
Default RTL Version
Demo 13
Coming soon
Demo 14
Coming soon
Demo 15
Coming soon
Demo 16
Coming soon
Demo 17
Coming soon
Demo 18
Coming soon
Demo 19
Coming soon
Demo 20
Coming soon
Demo 21
Coming soon
Demo 22
Coming soon
Demo 23
Coming soon
Demo 24
Coming soon
Demo 25
Coming soon
Demo 26
Coming soon
Demo 27
Coming soon
Demo 28
Coming soon
Demo 29
Coming soon
Demo 30
Coming soon
Buy Metronic Now!
Jason Muller Active
Jason Muller 2 Hours
How likely are you to recommend our company
to your friends and family?
30 Seconds You
Hey there, we’re just writing to let you know that you’ve
been subscribed to a repository on GitHub.
Jason Muller 30 Seconds
Ok, Understood!
Just Now You
You’ll receive notifications for all issues, pull requests!
Jason Muller 2 Hours
You were automatically subscribed
because you’ve been given access to the repository
30 Seconds You
You can unwatch this repository immediately
by clicking here:
Jason Muller 30 Seconds
Ok!
Just Now You
Ok!