mrkkr91 mrkkr91 - 5 months ago 40
CSS Question

How to center div within col-md-12 in bootstrap

I have problem with centering components within

col-md-12
. For example I have 12 columns with
<h1>
or
<h2>
inside. I want to
<h1>
to be centered.



<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>

<div class="container">
<div class="row">
<div class="col-md-12">
<div id="naglowek">
<h1>Something</h1>
</div>
</div>
</div>
</div>





I tried to access css class
text-center
or
block-center
to divs, but everytime
<h1>
was floated to the left. I need have this centered and set padding on my own. How can I solve this?

Answer

<div class="col-md-12 text-center"> works for bootstrap, no need to add any style unless you have already some style for h1. even if that's the case, you can use .text-center for h1 seems you are using width in that parent div. don't do that ever if you need content to be 100% width. and as per background, if you need 100% area occupy the background, you can simply use it in the div if not, you better use it with some pseudo classes :before or :after