Skip to content

Instantly share code, notes, and snippets.

@kevinberonilla

kevinberonilla/slds-form.gist Secret

Created February 4, 2016 19:12
Show Gist options
  • Save kevinberonilla/fb8f26f30931898b0dff to your computer and use it in GitHub Desktop.
Save kevinberonilla/fb8f26f30931898b0dff to your computer and use it in GitHub Desktop.
Download ZIP
SLDS Form Element Example
Raw
slds-form.gist
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="assets/styles/salesforce-lightning-design-system-vf.css">
</head>
<body>
<div class="slds">
<form class="slds-form--inline">
<div class="slds-form-element">
<label class="slds-form-element__label" for="name">Name</label>
<div class="slds-form-element__control">
<input id="name" class="slds-input" type="text" placeholder="John Smith" />
</div>
</div>
<div class="slds-form-element">
<label class="slds-form-element__label" for="selectSample1">Select Label</label>
<div class="slds-form-element__control">
<div class="slds-select_container">
<select id="selectSample1" class="slds-select">
<option>Option One</option>
<option>Option Two</option>
<option>Option Three</option>
</select>
</div>
</div>
</div>
<button class="slds-button slds-button--brand" type="button">Send</button>
</form>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment