두 개의 img 태그를 중앙에 배치하는 방법

Question

두 개의 img 태그를 서로 중첩 시키려고하지만 둘 다 가운데에 놓으려고합니다. http://nathanturnbull.me/scrolldiv/home.html

html로 : 메신저가 일을하려고 여기 어디에

이다

<div id="divs" class="div1"> 
    <div class="textcont"> 
     <img class="imglogo" src="gpk.gif" alt="GPK NET"> 
     <div class="textcont" > 
      <img class="imgbutton" src="gpk.gif"> 
     </div> 
    </div> 
</div> 

는 CSS :

#divs, #div4 { 
    height: 100%; 
    width: 100%; 
    overflow: hidden; 
    background-size: cover; 
    font-family: 'Cousine'; 
    font-size: 80px; 
    color: #ffffff; 
    text-align: center; 
} 

.div1 { 
    display: table; 
} 

.textcont { 
    display: table-cell; 
    vertical-align: middle; 
    background-color: transparent; 
} 

.imgbutton { 
    height: 42px; 
    width: 84px; 
} 

Answer 1

.container { 
    text-align: center; 
} 

.container IMG { 
    display: inline; /* browser default */ 
} 

또는

IMG { 
    display: block; 
    margin: 0 auto; 
} 

,

이미지가 컨테이너 내부에서 수평 가운데에 위치해야합니다.

Answer 2

.textcont CSS 클래스의 display:table-cell; 문을 삭제하십시오.

See example.