2012-01-21 7 views
0

可能性の重複: - 私はだろうか垂直中央現在h1タグ
Vertically align div (no tables)本部コンテンツアライメントクエリ

は私がdiv持っていると私は、このdiv内のすべてのコンテンツを揃えたいですこれを行う?

HTML:

<div> 
    <h1>Content</h1> 
</div> 

CSS:

div{ 
    width:100%; 
} 
div h1{ 
    margin:0 auto; 
} 
+2

は、あなたが実際にStackOverflowの上でこれを検索することがありますか?この同じ質問は、ほぼ毎日尋ねられ、答えられます。 [垂直方向のディビジョンコンテンツ](http://stackoverflow.com/search?q=vertically+align+div+content&submit=search) –

答えて

1

私は縦にあなたのDIVコンテナを中心には、クロスブラウザのソリューションが存在しないと思いますが、あなたを可能にするjQueryプラグインがありますこれを行うには:

(function ($) {
// VERTICALLY ALIGN FUNCTION
$.fn.vAlign = function() {
return this.each(function(i){
var ah = $(this).height();
var ph = $(this).parent().height();
var mh = (ph - ah)/2;
$(this).css('margin-top', mh);
});
};
})(jQuery);

その後、あなたはこのJavascriptを追加することができます。

$(document).ready(function() {
$('div h1').vAlign();
});