HTML div의 가운데 버튼 행

Question

HTML 행에 버튼 행을 가운데 놓으려고합니다.

<div id="menuBarLine" style="position:relative; float:left; width:24%; background-color: black"> 
     <div id="toggleFullscreen" style="color:red; visibility:visible; position:relative; float:right" ;> 
      <button title="Fullscreen" onClick="fullscreen();">Fullscreen</button> 
     </div> 
     <div id="toggleMap" style="display:none; position:relative; float:right" ;> 
      <button title="Show/Hide Map" onClick="toggleMap();">Image Map</button> 
     </div> 
     <div id="toggleCarousel" style="color:red; visibility:visible; position:relative; float:right" ;> 
      <button title="Show/Hide Thumbnails" onClick="toggle_carousel();">Thumbnails</button> 
     </div> 
<div id="toggleBib" style="color:red; visibility:visible; position:relative; float:right" ;> 
      <button title="Show/Hide Bibliography" onClick="toggleBib();">Bibliography</button> 
     </div> 
     <div id="showGalleryMenuButton" style="display: block; position:relative; float:right" ;> 
      <button id="showGalleryMenuButtonButton" title="Show/Hide Gallery Menu" onClick="toggle_visibility('menu');">Galleries</button> 
     </div> 
     </div> 

그래서 모든 단추를 menuBarLine div에 가운데 놓기를 원합니다. 시각적으로 작업중인 사이트를 참조하십시오. http://www.blakearchive.org/blake/public/exhibits/canterbury.html

오른쪽 열의 맨 위에 버튼을 가운데에 놓고 싶습니다. 나는 여백을 시험해 보았다 : div에 0 자동. 그러나 그것은 작동하지 않았다.

감사합니다.

Answer 1

1- text-align:center을 menuBarLine으로 설정하십시오.

2- 제거 이것은 모든 버튼마다 버튼

display:none; position:relative; float:right 

-3-

display:inline-block 및 추가의 속성.