Responsive Grid

by grant

HTML

<section class="container">
	<div class="box">
		<h1>This is the first box</h1>
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci voluptates, aut totam eaque possimus molestiae atque odio vero optio porro magni, quis culpa ea. Perferendis, neque, enim. Rem, quia, quisquam.</p>
	</div>

CSS

.container{
	display:flex;
  border: 1px dashed red;
	flex-wrap:wrap;
	text-align:center;
  justify-content: center;
}
.box{
	width:100%;
	max-width:80%;
	border:1px solid red;
	margin:5px;
}
@media only screen and ( max-width:768px ){
	
	.box{
		width:100%;
		max-width:40%;
		border:1px solid red;
	}
}