JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrap">
      <div class="icons">
        <div class="icons_item icons_item_hide"><a class="icon" href=""></a></div>                  
        <div class="icons_item"><a class="icon" href=""><img src="images/circle_border.png"></a></div>          
        <div class="icons_item"><a class="icon" href=""><img src="images/circle_border.png"></a></div>   
        <div class="icons_item icons_item_hide"><a class="icon" href=""></a></div>        
        <div class="icons_item"><a class="icon" href=""><img src="images/circle_border.png"></a></div>          
        <div class="icons_item"><a class="icon" href=""><img src="images/circle_border.png"></a></div>          
        <div class="icons_item"><a class="icon" href=""><img src="images/circle_border.png"></a></div>          
        <div class="icons_item"><a class="icon" href=""><img src="images/circle_border.png"></a></div>          
      </div>
    </div>

CSS

body, html{
	margin: 0;
	padding: 0;
	height: 100%;
	background: #999;
}

.wrap{
	margin: 0 auto;
	overflow: hidden;
	height: 100%;
}

	.icons{
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;		
		justify-content: space-around;	
		height: 100%;

	}

		.icons_item{
			width: 50%;
			height: 33%;
			display: flex;
		}

		.icons_item_hide{
			display: none;
		}

			.icon{
				width: 100%;
				display: block;
			}

				.icon img{
					display: block;
					width: 66%;
					margin: 0 auto;
				}


/* iPad h*/
@media screen and (max-width: 1024px) {
	body {background: green;}
	.icons_item{
		width: 25%;
		height: 50%;
	}

	.icons_item_hide{
		display: block;
	}

		.icon img{
			width: 66%;
		}	

}

/* iPad v*/
@media screen and (max-width: 768px) {
	body {background: maroon;}
	.icons_item{
		width: 50%;
		height: 33%;
	}

	.icons_item_hide{
		display: none;
	}	
		.icon img{
			width: 66%;
		}		
}

/* iphone6Plus */
@media screen and (max-width: 414px) {
	body {background: orange;}
}

/* iphone6 */
@media screen and (max-width: 375px) {
	body {background: lime;}
}

/* iphone5 */
@media screen and (max-width: 320px) {
	body {background: red;}
}