Centralizar ul no bootstrap

[mruoppolo 14]

Olá, tudo bem?

 

Ja faz um tempinho que eu não faço frontend e hoje estive me mantando para montar um layout mega simples, kkkk, bom eu estou criando um rodapé e preciso que ele fique com o logo na próxima linha um menu com 4 itens e na última um menu de redes sociais, igual esta na foto:

 

Eu ja fiz todas as formatações, porém não estou conseguindo fazer ficar centralizado no bootstrap os códigos são:

 

html

<div class="container-fluid">
    <div class="row">
      <div class="col-md-12 menuBar">
        <div class="col-md-offset-1 col-md-10 col-md-offset-1">
          <div class="col-md-offset-3 col-md-6 col-md-offset-3 center">
            <img src="images/uploads/logo/default-footer.jpg" alt="">
            <ul class="footerMenu">
              <li>
                <a href="#">Home</a>
              </li>
              <li>
                <a href="#">Todos os Itens</a>
              </li>
              <li>
                <a href="#">Promoções</a>
              </li>
              <li>
                <a href="#">Contato</a>
              </li>
            </ul>
            <div class="clear"></div>
            <ul class="social">
              <li>
                <a href="#" target='_Blank'><img src="images/social/facebook.png" alt=""></a>
              </li>
              <li>
                <a href="#" target='_Blank'><img src="images/social/instagram.png" alt=""></a>
              </li>
              <li>
                <a href="#" target='_Blank'><img src="images/social/twitter.png" alt=""></a>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>

CSS

ul.footerMenu{list-style-type:none; margin-top:5px;}
ul.footerMenu li{float:left; border-right:1px solid #fff;}
ul.footerMenu li:last-child{border-right:0;}
ul.footerMenu li a{color:#fff; padding:5px; text-align: center;}
ul.social{list-style-type:none; margin-top:10px;}
ul.social li{float:left;}
ul.social li a{color:#fff; padding:5px; text-align: center;}
.center{float: none; margin-left: auto; margin-right: auto;}

Sabe o que esta faltando?

 

Valeu :D

[stromdh 15]

Uma sugestão de estrutura de leitura e manipulação mais fácil onde você não ira precisar colocar tantas colunas uma dentro da outra com offset.

 

o Bootstrap tem classes nativas as quais você não precisará desenvolver nenhum tipo de formatação CSS. São elas:

 

class="text-center" - centralizar

class="list-unstyled" - lista sem marcadores

class="list-inline" - lista inline para menus horizontais

<div class="container-fluid">
    <div class="row">
      <div class="col-md-12 menuBar">
        <img src="images/uploads/logo/default-footer.jpg" alt="">
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <ul class="footerMenu">
              <li>
                <a href="#">Home</a>
              </li>
              <li>
                <a href="#">Todos os Itens</a>
              </li>
              <li>
                <a href="#">Promoções</a>
              </li>
              <li>
                <a href="#">Contato</a>
              </li>
            </ul>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <ul class="social">
              <li>
                <a href="#" target='_Blank'><img src="images/social/facebook.png" alt=""></a>
              </li>
              <li>
                <a href="#" target='_Blank'><img src="images/social/instagram.png" alt=""></a>
              </li>
              <li>
                <a href="#" target='_Blank'><img src="images/social/twitter.png" alt=""></a>
              </li>
            </ul>
      </div>
    </div>
  </div>

Talvez isso possa facilitar as coisas pra você.

[mruoppolo 14]

Olá stromdh, esta text-center apenas centraliza o texto, eu preciso centralizar tudo o logo, abaixo dele o menu e abaixo as redes sociais, como seria isso??

 

Obrigado

[mruoppolo 14]

Ah!!! Agora que eu entendi, eu substitui as minhas classes pelas que você informou e funcionou certinho.

 

Valeu stromdh