Search code examples
htmlcsstwitter-bootstrapcentering

Bootstrap - can't center div

how can I center this please? As you can see, it's on the left side of the screen. I tried margin:0 auto; but it didn't help me.

URL: http://www.dev.dkenergy.sk/elektromontaze

What I want to center?

IMAGE

Thank you so much.

HTML:

<div class="container-fluid elektromontaze">
  <div class="row">
    <div class="col-md-12">
      <div class="container">
        <div class="col-md-4">
          <div class="well">
          </div>
        </div>
        <div class="col-md-8">
          <div class="row">
            <div class="col-md-12">
              <div class="elone">
                <h3 class="bold">silnoprúdové zariadenia</h3>
                <h4>Klasická inštalácia (domy, firmy) do 1000V vrátené bloskozvodov</h4>
                <div class="elektromontaze-separator"></div>
                <p>odborné poradenstvo ako aj samotná inštalácia kvalifikovanými odborníkmi vrátané kabeláže a dodanie materiálu.</p>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12">
              <div class="eltwo">
                <h3 class="bold">slaboprúdové zariadenia</h3>
                <div class="elektromontaze-separator"></div>
                <h4>Komunikačné a zabezpečovacie systémy (CCTV systém, alarmy)</h4>
                <p>odborné poradenstvo ako aj samotná inštalácia kvalifikovanými odborníkmi vrátané kabeláže a dodanie materiálu.</p>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12">
              <div class="elone">
                <h3 class="bold">opravy a údržby</h3>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12">
              <div class="eltwo">
                <h3 class="bold">kompletné revízie</h3>
              </div>
            </div>
          </div>
        </div>
      </div>      
    </div>
  </div>
</div>

CSS:

.elektromontaze {
background:url("/images/bg-fotovoltaika.jpg");
background-size:100% auto;
background-repeat:no-repeat;
min-height:700px;
}

.elektromontaze-separator {
border-top:1px #353535 solid;
width:100%;
margin:0 auto 20px auto;
}

.elektromontaze h3 {
font-size:1.5em;
text-transform: uppercase;
}

.elektromontaze .col-md-4 {
margin:0;
padding:0;
width:159px;
}

.elektromontaze .col-md-8 {
margin:0;
padding:0;
}

.elektromontaze .well {
background-image: url("/images/bg-side.jpg");
background-repeat: no-repeat;
min-height: 600px;
width:159px;
padding: 19px;
margin-bottom: 20px;
border:none;
margin:0;
padding:0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
}

.elone {
background:#f9cb42;
border-bottom: 3px #b39439 solid;
padding:20px 20px 20px 40px !important;
min-height:105px !important;
}

.eltwo {
background:#f2d170;
border-bottom: 3px #b39439 solid;
padding:20px 20px 20px 40px !important;
min-height:105px !important;
}
Solution

  • I'm not sure if that is what you want, but maybe the answer is: - please remove from .elektromontaze .col-md-4 line: margin: 0 - add to col-md-4 class col-md-offset-1