grid-template-columns: 25px 1fr 25px;

> * {
  grid-column: 2; /* start all content at grid line 2 */
  margin: 0.5em 0;
}

display: grid;
grid-template-columns: 25px minmax(250px, auto) 25px;
margin: 100px auto;
max-width: 1000px;

> * {
  grid-column: 2;
  margin: 0.5em 0;
}

@media (max-width: 345px) {
  grid-template-columns: 25px minmax(250px, 310px) 25px;
}

import styled from 'styled-components'

const Post = styled.article`
  display: grid;
  grid-template-columns: 25px minmax(250px, max-content) 25px;
  margin: 100px auto;
  max-width: 1000px;

  > * {
    grid-column: 2;
    margin: 0.5em 0;
  }

  /* Other styles for elements from markdown here */

  @media (max-width: 345px) {
    grid-template-columns: 25px minmax(250px, 310px) 25px;
  }

  @media (min-width: 736px) {
    grid-template-columns: 50px 1fr 50px;
  }
 `

 Post.displayName = 'Post'

 export default Post