左寄せの div を中央に置く CSS

左寄せの div をページ全体でセンタリングするスタイルシート

view plainprint?

1. /* CSS */  
2. div.sotomi{  
3.  text-align: center;  
4. }  
5.   
6. div.nakami{  
7.  display: inline-block;  
8.  text-align: left;  
9. }  
10.   
11. /* HTML */  
12. <div class="sotomi" style="background-color:#eeeeff;">  
13.  <div class="nakami" style="background-color:#ffeeee;">  
14.   ほげほげ<br ⁄>  
15.   ほげほげほげほげほげほげ<br ⁄>  
16.   ほげほげ<br ⁄>  
17.  </div>  
18. </div>  

/* CSS */
div.sotomi{
 text-align: center;
}

div.nakami{
 display: inline-block;
 text-align: left;
}

/* HTML */
<div class="sotomi" style="background-color:#eeeeff;">
 <div class="nakami" style="background-color:#ffeeee;">
  ほげほげ<br ⁄>
  ほげほげほげほげほげほげ<br ⁄>
  ほげほげ<br ⁄>
 </div>
</div>

結果