Skip to content

Instantly share code, notes, and snippets.

@rob0t7
Created December 19, 2017 21:29
Show Gist options
  • Save rob0t7/8c8017b5f9ee3cdb16185b122cf161b4 to your computer and use it in GitHub Desktop.
Save rob0t7/8c8017b5f9ee3cdb16185b122cf161b4 to your computer and use it in GitHub Desktop.
Broken Input Grid
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
*,*:before,*:after {
box-sizing: border-box;
}
input {
padding: .5rem 1rem;
border: 1px solid #000;
margin: 0;
display: block;
width: 100%;
}
.input-fields {
display: grid;
grid-template-columns: 2fr 1fr;
grid-column-gap: .5rem;
}
</style>
</head>
<body>
<div class="input-fields">
<input type="text" placeholder="Input 1">
<input type="text" placeholder="Input 2" >
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment