Skip to content

Instantly share code, notes, and snippets.

@SQL-MisterMagoo
Created May 31, 2020 00:40
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 SQL-MisterMagoo/5d2379e65b671b8b7c68cfdb08277dec to your computer and use it in GitHub Desktop.
Save SQL-MisterMagoo/5d2379e65b671b8b7c68cfdb08277dec to your computer and use it in GitHub Desktop.
SampleCard
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Input Test</title>
<style>
.container {
width:90%;
max-width:900px;
margin:auto;
}
.card {
display:flex;
width: 100%;
outline:solid thin gray;
}
.comments {
padding: 1em;
display: flex;
flex-grow: 1;
flex-direction: column;
}
a {
width:100%;
text-decoration: none;
}
</style>
</head>
<body>
<div class="container">
<a href="#">
<div class="card">
<div style="background-image: url('https://source.unsplash.com/200x150?Cats');width:200px;height:150px;"></div>
<span class="comments">
<span class="post-meta">
<span class="category">Category</span>
<span class="mr-2">March 15, 2018 </span> &bullet;
<span class="ml-2">💬 0</span>
</span>
<h2>Post Headline</h2>
</div>
</div>
</a>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment