내 머리글에 내용을 가운데에 맞춰 넣을 수 없습니다.

Question

머리글 표의 가운데에 모든 내용을 가져 오려고하는데 어떻게 할 수 없습니까? 나는 그것을 수직 중심으로 만들었지 만, 수평으로 중심을 잡는 방법을 알 수는 없다. 어떻게하는지 말해 줄 수 있니? 대신 https://fiddle.jshell.net/rgfxs94L/2/

<div id="header"> 
    <div class="center"> 
    <div class="header_cells"> 
     <img onclick="get_page('?page=home');" title="logo" id="logo" src="http://www.rajohan.no/img/logo_small.png"> 
    </div> 
    <div id="main_buttons" class="header_cells"> 
     <div id="home" class="header_cells"> 
     &lt;Home&gt; 
     </div> 
     <div id="cv" class="header_cells"> 
     &lt;CV&gt; 
     </div> 
     <div id="nyheter" class="header_cells"> 
     &lt;Nyheter&gt; 
     </div> 
     <div id="movie" class="header_cells"> 
     &lt;Film&gt; 
     </div> 
     <div id="games" class="header_cells"> 
     &lt;Spill&gt; 
     </div> 
     <div id="music" class="header_cells"> 
     &lt;Musikk&gt; 
     </div> 
    </div> 
    <div class="header_cells"> 
     <form id="search_form"> 
     <input type="search" id="search_box" placeholder="S&oslash;k..."> 
     </form> 
    </div> 
    </div> 
</div> 

#header { 
    border-top: 3px solid #e87f29; 
    background-color: #f8f8f8; 
    min-width: 100%; 
    min-height: 100%; 
    position: static; 
    border-bottom: 1px solid #e8e8e8; 
    display: table; 
} 

.center { 
    text-align: center; 
} 

.header_cells { 
    display: table-cell; 
    min-height: 100%; 
    min-width: 100%; 
    vertical-align: middle; 
} 

#logo { 
    width: auto; 
    max-height: 40%; 
} 

Answer 1

사용 인라인 블록 :

https://fiddle.jshell.net/o4u8per4/

.header_cells { 
    display:inline-block; 
    vertical-align: middle; 
}