Align images and text inside div

Navigation
0

I need to align some elements on a page and I'm not getting it, I've already done some tests like using text-align:center in class pull-right as well as header-features according to examples I've read, but with no success. >

What I have is this: 

 <!-- ALINHA CONTEÚDO -->
  <div class="row">
    <div class="col-md-12">
     <!-- CLASSE ONDE O CONTEÚDO ESTÁ -->
      <div class="pull-right">
        <ul class="header-features">
          <li><i class="fa fa-bullhorn"></i>
            <div class="header-feature-caption"> <img src="img/caixa.jpg" width="108"> </div>
          </li>
          <li><i class="fa fa-hand-o-right"></i>
            <div class="header-feature-caption">
              <h5 class="header-feature-title">ANUNCIAR IMÓVEIS</h5>
              <p class="header-feature-sub-title">clique aqui</p>
            </div>
          </li>
        </ul>
      </div>
    </div>
  </div>

And their css are these: 

.pull-right {
  float: right !important;
}

.header-features {
  list-style: none;
  margin: 0;
  padding: 0;
}

What I'm trying to do is this:

Theprojectcanbeseenhere: Demonstration Page

    
asked by anonymous 01.04.2016 / 14:34

2 answers

0

From what I visualized you are working with Bootstrap, do a test: delete the div from the pull-right and put the class pull-right in the UL tag and to ensure in your col-md-12 add also the class: text -right

And give me a feedback here if it worked!

    
01.04.2016 / 14:45
0

Do the following: 

<div class="col-md-12">

          <center>

            <ul class="header-features">
              <li><i class="fa fa-bullhorn"></i>
                <div class="header-feature-caption"> <a href="http://www1.caixa.gov.br/atendimento/canais_atendimento/correspondente_caixa_aqui.asp" target="_blank"><img src="img/correspondente-caixa.jpg" width="108"></a> </div>
              </li>
              <li><i class="fa fa-hand-o-right"></i>
                <div class="header-feature-caption">
                  <h5 class="header-feature-title">ANUNCIAR IMÓVEIS</h5>
                  <p class="header-feature-sub-title">clique aqui</p>
                </div>
              </li>
            </ul>
          </center>

</div>

At least I did it here in my browser and it worked.

Remove the pull-right class, you will not need it, and in place of the div, put the <center>

    
01.04.2016 / 15:10
Comments with Facebook for different news on site Problem loading CSS Sass file