[css] div 안에 div 이미지 가운데 정렬

<style> 

#loading {

    width: 100%; 
    height: 100%; 
    position: fixed; 
    display: table; 
    opacity: 0.7; 
    background-color: #fff; 
    z-index: 99; 
    }  
#loding_inner { 
    display: table-cell; 
    text-align: center; 
    vertical-align: middle;} 
#loading-image { display: inline-block; 
    z-index: 100; 
    width: 50%; 

    }
 
</style> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
        $('#loading').show();  
    }); 
</script>
 
 
<div id="loading">
    <div id="loding_inner">
        <img id="loading-image" th:src="@{/resources/js/loading.png}" alt="Loading..." />
    </div>
</div>