Skip to content

Instantly share code, notes, and snippets.

@New0

New0/caldera-label-left.css

Last active July 3, 2017 18:56
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save New0/f5c4390234fc824188ba59d47365705f to your computer and use it in GitHub Desktop.
Save New0/f5c4390234fc824188ba59d47365705f to your computer and use it in GitHub Desktop.
Download ZIP
Caldera Forms label on left of input
Raw
caldera-label-left.css
/************* Modern version for browsers with flex support https://caniuse.com/#feat=flexbox ********************/
.caldera-grid .form-group {
display: flex;
}
.caldera-grid .form-group label {
width: 25%; /*Set to the width needed by the text of your label */
}
.caldera-grid .form-group > div{
width: 75%; /*Set to the width needed by the text of your input */
}
/*************** Version for older browsers ***********
.caldera-grid .form-group {
display: block;
}
.caldera-grid .form-group label {
width: 25%;
display: block;
float: left;
}
.caldera-grid .form-group > div{
width: 75%;
display: block;
float: left;
}
*****************/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment