JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <!---THIS is the pic in question I'm trying to center--><div id="logo"><div id="wrap"><img src="http://imgur.com/3PlqF0h.png"></div></div>
		<div id="row">
			<div class="cell"><img src="http://imgur.com/UTfvaBO.jpg"></div>
			<div class="cell"><img src="http://imgur.com/4oGLXsY.jpg"></div>
			<div class="cell"><img src="http://imgur.com/HuLnI2j.jpg"></div>
			<div class="cell"><img src="http://imgur.com/7aPwvfQ.jpg"></div>                
            </div></div>

CSS

/*table rules!!!*/	    

        .container {
		display:table-row;
    position: relative;
		width:100%;
		}
		
		.row {
		display:table-row;
		width:100%;
		}
		
		.cell {
		position:relative;
		display:table-cell;
		background-color:black;
		width:700px;
		height:auto;
		}
		
		body {
		margin:0;
		padding:0;
		}

/*failed logo stuff that isn't working*/
        
        #logo {
		z-index:10;
		position:absolute;
		width:100%;
    height: 100%;
		}

#wrap { margin: 0 auto; width: 400px; height: 452px; line-height: 452px }
#wrap img { vertical-align: middle; }