html - 难以将页脚中的元素居中

Question

我的脚有 3 列。我想要做的是将内容置于网站主体的中心。现在所有内容都在各自的 div 中左对齐。我无法在不使文本居中的情况下将内容居中。

Current Footer

footer#footer .dt-social {
       text-align: left;
     }
     footer#footer a {
       color: #fff;
     }
     footer#footer a:hover {
       text-decoration: none;
       border-bottom-width: 1px;
       border-bottom-style: dotted;
       border-bottom-color: rgba(255, 255, 255, 0.5);
     }
     footer#footer .widget_recent_entries ul li {
       padding-left: 0;
     }
     footer#footer .widget_recent_entries ul li .icon {
       display: none;
     }
     footer#footer #footer-left a {
       border: 0;
     }
     footer#footer .widget_text ul {
       padding-left: 0px;
     }
     footer#footer .widget_text ul .icon:before {
       font-family: "fontello";
       font-style: normal;
       content: '\ea43';
       margin-left: -20px;
       width: 0;
     }
     footer#footer .widget_text ul li {
       list-style: none;
       /*border-bottom: 1px solid rgba(0, 0, 0, 0.3);*/
       padding: 5px 0 5px 0px;
     }
     footer#footer .widget_text ul li:last-child {
       border: none;
     }
     footer#footer .widget_text ul li i {
       font-size: 17px;
     }
     footer#footer .widget_text ul .children {
       margin-top: 5px;
       margin-bottom: -5px;
       padding: 0px;
     }
     footer#footer .widget_text ul .children li {
       padding: 5px 0 5px 20px;
       border: none;
     }
     footer#footer .widget_text ul.list-inline-icon li {
       border: none;
       padding: 0;
       width: 30px;
       height: 30px;
       border: 1px solid rgba(255, 255, 255, 0.2);
       -webkit-border-radius: 50%;
       border-radius: 50%;
       background-clip: padding-box;
       background: none;
       margin-right: .5em;
     }
     footer#footer .widget_text ul.list-inline-icon li a {
       font-size: 30px;
       color: #ffffff;
       line-height: 0;
     }
     footer#footer .widget_text ul.list-inline-icon li a i {
       line-height: 1.4em;
       margin: 0;
     }
     footer#footer .widget_text ul.list-inline-icon li a:hover {
       color: #ffffff;
     }
     footer#footer .widget_text ul.list-inline-icon li:hover {
       color: #ffffff;
       border: 1px solid #f16338;
       background: #f16338;
     }
     footer#footer .sequence-twitter {
       min-height: 180px;
     }
     footer#footer .owl-theme .owl-controls {
       text-align: left;
     }
     footer#footer .owl-theme .owl-controls .owl-page span {
       background-color: #f16338;
       opacity: 1;
     }
     footer#footer .owl-theme .owl-controls .owl-page.active span {
       background: none;
       border: 2px solid #f16338;
     }
     footer#footer .widget_calendar a {
       color: #f16338;
     }
     footer#footer .widget_calendar a:hover {
       color: #b6340d;
     }
     footer#footer .widget_calendar #calendar_wrap {
       border: 0px solid #bdc3c7;
       padding: 20px;
     }
     footer#footer .widget_calendar #today {
       background-color: #f16338;
     }
     footer#footer .widget_calendar .pad {
       color: #515151;
     }
     footer#footer .widget_calendar th {
       text-align: center;
       line-height: 2;
     }
     footer#footer .widget_calendar td {
       text-align: center;
       line-height: 2;
     }
     footer#footer .widget_calendar thead th {
       color: #f16338;
     }
     footer#footer .widget_search {
       color: #ffffff;
     }
     footer#footer .widget_search .screen-reader-text {
       display: none;
     }
     footer#footer .widget_search #searchsubmit {
       display: none;
     }
     footer#footer .widget_search #s {
       border-width: 1px;
       border-style: solid;
       padding: 5px 5px 5px 30px;
       width: 100%;
       background: none;
       font-size: 0.8em;
       color: #fff;
     }
     footer#footer .widget_search i {
       padding: 5px 5px;
       position: absolute;
     }
     footer#footer .dt_widget_portfolio_posts .post-item {
       padding: 0px;
     }
     footer#footer .dt_widget_portfolio_posts .post-item figure {
       -webkit-transform-style: preserve-3d;
       -moz-transform-style: preserve-3d;
       -ms-transform-style: preserve-3d;
       -o-transform-style: preserve-3d;
       transform-style: preserve-3d;
       height: 85px;
       width: 85px;
       overflow: hidden;
     }
     footer#footer .dt_widget_portfolio_posts .post-item figure > div {
       overflow: hidden;
     }
     footer#footer .dt_widget_portfolio_posts .post-item figure figcaption {
       -webkit-transition: -webkit-transform 0.3s;
       -moz-transition: transform 0.3s;
       -o-transition: transform 0.3s;
       -ms-transition: transform 0.3s;
       background: rgba(39, 11, 3, 0.6);
       opacity: 1;
       background-clip: padding-box;
       text-align: center;
       height: 85px;
     }
     footer#footer .dt_widget_portfolio_posts .post-item figure figcaption a {
       display: table;
       display: block;
       width: 100%;
       height: 100%;
     }
     footer#footer .dt_widget_portfolio_posts .post-item figure:hover figcaption,
     footer#footer .dt_widget_portfolio_posts .post-item figure.cs-hover figcaption {
       -webkit-transform: translate(0, -100%);
       -moz-transform: translate(0, -100%);
       -ms-transform: translate(0, -100%);
       -o-transform: translate(0, -100%);
       transform: translate(0, -100%);
     }
     footer#footer .dt_widget_portfolio_posts .post-item figure .zoom-plus {
       width: 100%;
       height: 50px;
       position: relative;
       left: 0%;
       display: table-cell;
       text-align: center;
       vertical-align: middle;
       display: block;
     }
     footer#footer .dt_widget_portfolio_posts .post-item figure .zoom-plus::before,
     footer#footer .dt_widget_portfolio_posts .post-item figure .zoom-plus::after {
       top: 50%;
       left: 50%;
     }
     footer#footer .dt_widget_portfolio_posts .post-item figure .zoom-plus::before {
       content: '';
       width: 20px;
       height: 20px;
       position: absolute;
       display: block;
       border-bottom: #fff solid 1px;
       -webkit-transition: transform 0s;
       -moz-transition: transform 0s;
       -o-transition: transform 0s;
       -ms-transition: transform 0s;
       transition: transform 0s;
       -webkit-transform: translate(-50%, 0);
       -moz-transform: translate(-50%, 0);
       -ms-transform: translate(-50%, 0);
       -o-transform: translate(-50%, 0);
       transform: translate(-50%, 0);
     }
     footer#footer .dt_widget_portfolio_posts .post-item figure .zoom-plus::after {
       content: '';
       width: 20px;
       height: 20px;
       position: absolute;
       display: block;
       border-left: #fff solid 1px;
       -webkit-transition: transform 0s;
       -moz-transition: transform 0s;
       -o-transition: transform 0s;
       -ms-transition: transform 0s;
       transition: transform 0s;
       -webkit-transform: translate(0, 50%);
       -moz-transform: translate(0, 50%);
       -ms-transform: translate(0, 50%);
       -o-transform: translate(0, 50%);
       transform: translate(0, 50%);
     }
     footer#footer .widget_tag_cloud .tagcloud .tag {
       display: inline-table;
       font-size: 12px;
       background: none;
       border-width: 1px;
       border-style: solid;
       padding: 8px 10px;
       margin: 0 5px 5px 0;
     }
     footer#footer .widget_tag_cloud .tagcloud .tag a:hover {
       color: #ffffff;
     }
     footer#footer .widget_tag_cloud .tagcloud .tag:hover {
       background-color: #f16338;
     }
     footer#footer .widget_tag_cloud .tagcloud .tag:hover a {
       color: #ffffff;
     }
     footer#footer .woocommerce.widget_product_tag_cloud .tagcloud .tag {
       display: inline-table;
       font-size: 12px;
       background: none;
       border-width: 1px;
       border-style: solid;
       padding: 8px 10px;
       margin: 0 5px 5px 0;
     }
     footer#footer .woocommerce.widget_product_tag_cloud .tagcloud .tag a:hover {
       color: #ffffff;
     }
     footer#footer .woocommerce.widget_product_tag_cloud .tagcloud .tag:hover {
       background-color: #f16338;
     }
     footer#footer .woocommerce.widget_product_tag_cloud .tagcloud .tag:hover a {
       color: #ffffff;
     }
     footer#footer .widget_categories {
       font-size: 14px;
     }
     footer#footer .widget_categories select {
       width: 95%;
       border: 1px solid #bdc3c7;
       padding: 5px;
       color: #515151;
     }
     footer#footer .widget_categories a.select-target {
       background: none;
     }
     footer#footer .widget_archive {
       font-family: 'Dosis';
     }
     footer#footer .widget_archive li {
       border-bottom: 1px solid #bdc3c7;
     }
     footer#footer .widget_archive select {
       width: 95%;
       border: 1px solid #bdc3c7;
       padding: 5px;
       color: #515151;
     }
     footer#footer .widget_archive a.select-target {
       background: none;
     }
     footer#footer .widget_recent_comments a {
       font-style: italic;
       color: rgba(255, 255, 255, 0.4);
     }
     footer#footer .widget_recent_comments a:hover {
       color: #f16338;
     }
     footer#footer .widget_recent_comments .comment-author {
       /*color: @white;*/
     }
     footer#footer .widget_recent_comments li.recentcomments {
       /*border-color: @footer-border-color;*/
     }
     footer#footer .dt_widget_tabs .nav-tabs li a {
       background: none;
       border-width: 1px;
       border-style: solid;
     }
     footer#footer .dt_widget_tabs .nav-tabs li a:hover {
       color: #ffffff;
       background-color: #f16338;
     }
     footer#footer .dt_widget_tabs .nav-tabs li:hover {
       background-color: #f16338;
     }
     footer#footer .dt_widget_tabs .nav-tabs li.active a {
       background-color: #f16338;
       border: 1px solid #f16338;
       color: #ffffff;
     }
     footer#footer .dt_widget_tabs .nav-tabs li.active a:hover,
     footer#footer .dt_widget_tabs .nav-tabs li.active a:focus {
       color: #ffffff;
       background-color: #f16338;
       border: 1px solid #f16338;
       border-top: 3px solid #f16338;
     }
     footer#footer .dt_widget_tabs .tab-pane {
       overflow: hidden;
     }
     footer#footer .dt_widget_tabs .tab-pane .rowlist {
       float: left;
       width: 100%;
       padding: 15px 0;
     }
     @media (max-width: 1200px) {
       footer#footer .dt_widget_tabs .nav-tabs li {
         display: block;
         width: 100%;
       }
     }
     footer#footer .dt_widget_accordion .btn-accordion {
       position: absolute;
       right: 30px;
       margin-top: -25px;
       color: #ffffff;
       background-color: #f16338;
     }
     footer#footer .dt_widget_accordion .opened {
       color: #f16338;
       background-color: #ffffff;
     }
     footer#footer .dt_widget_accordion .panel {
       margin-top: 10px !important;
       border: none;
       background: none;
     }
     footer#footer .dt_widget_accordion .panel:first-child {
       margin-top: 0px !important;
     }
     footer#footer .dt_widget_accordion .panel-heading {
       background: none;
       color: #ffffff;
       border-width: 1px;
       border-style: solid;
       -webkit-transition: background-color 0.8s;
       -moz-transition: background-color 0.8s;
       -o-transition: background-color 0.8s;
       -ms-transition: background-color 0.8s;
       transition: background-color 0.8s;
     }
     footer#footer .dt_widget_accordion .openedup {
       color: #ffffff !important;
       background-color: #f16338;
       -webkit-transition: background-color 0.8s;
       -moz-transition: background-color 0.8s;
       -o-transition: background-color 0.8s;
       -ms-transition: background-color 0.8s;
       transition: background-color 0.8s;
     }
     footer#footer .dt_widget_accordion .panel-body {
       margin-top: 10px;
       border-width: 1px;
       border-style: solid;
       background: none;
     }
     footer#footer .woocommerce.widget_product_search #s {
       border: 1px solid rgba(255, 255, 255, 0.4);
     }

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<footer id="footer" class="tertier_color_bg ">
  <section class="container footer-section">
    <div class="col-md-12 footer-right equal-height">
      <div id="footer-right">
        <div class="border-left col-md-4 col-sm-6 col-xs-6 col-3" style="display: block; height: 173px;">
          <div class="widget text-3 widget_text">
            <div class="textwidget">
              <p>24 Union Square East
                <br>New York, NY 10003
                <br>646.747.6640
                <br>
                <a href="mailto:info@hospitalityq.com">info@hospitalityq.com</a>
              </p>
            </div>
          </div>
        </div>
        <div class="border-left col-md-4 col-sm-6 col-xs-6 col-3" style="display: block; height: 173px;">
          <div class="widget nav_menu-3 widget_nav_menu">
            <div class="row">
              <div class="col col-sm-12 centered">
                <h3 class="widget-title">Connect</h3>
              </div>
            </div>
            <div class="menu-connect-with-us-container">
              <ul id="menu-connect-with-us" class="menu">
                <li class="logo-desktop hidden-sm hidden-xs">
                  <a href="http://216.213.81.216" style="">
                    <img id="logomenu" src="/wp-content/uploads/2015/03/HQ-Horizontal-Color-Logo-with-TM.png" alt="Hospitality Quotient" class="img-responsive halfsize">
                  </a>
                  <a href="http://216.213.81.216" style="">
                    <img id="logomenureveal" src="/wp-content/uploads/2015/03/HQ-Horizontal-Color-Logo-with-TM.png" alt="Hospitality Quotient" class="img-responsive halfsize">
                  </a>
                </li>
                <li id="menu-item-52" class=" menu-item menu-item-type-custom menu-item-object-custom menu-item-52"><a title="follow us on Facebook" href="https://www.facebook.com/HospitalityQ?fref=ts"><i class="icon-facebook-4"></i><span>Facebook</span></a>
                </li>
                <li id="menu-item-53" class=" menu-item menu-item-type-custom menu-item-object-custom menu-item-53"><a title="connect with us on LinkedIn" href="https://www.linkedin.com/company/2594533?trk=tyah&amp;trkInfo=clickedVertical%3Acompany%2Cidx%3A2-1-6%2CtarId%3A1436205450081%2Ctas%3Ahospitality%20q"><i class="icon-linkedin"></i><span>LInkedin</span></a>
                </li>
                <li id="menu-item-54" class=" menu-item menu-item-type-custom menu-item-object-custom menu-item-54"><a title="follow us on Twitter" href="https://twitter.com/HospitalityQ"><i class="icon-twitter-4"></i><span>Twitter</span></a>
                </li>
              </ul>
            </div>
          </div>
        </div>
        <div class="border-left col-md-4 col-sm-6 col-xs-6 col-3" style="display: block; height: 173px;">
          <div class="widget hq_nav_menu-2 widget_hq_nav_menu">
            <div class="soma_container">
              <ul id="menu-footer-links" class="some_list">
                <li class="logo-desktop hidden-sm hidden-xs">
                  <a href="http://216.213.81.216" style="">
                    <img id="logomenu" src="/wp-content/uploads/2015/03/HQ-Horizontal-Color-Logo-with-TM.png" alt="Hospitality Quotient" class="img-responsive halfsize">
                  </a>
                  <a href="http://216.213.81.216" style="">
                    <img id="logomenureveal" src="/wp-content/uploads/2015/03/HQ-Horizontal-Color-Logo-with-TM.png" alt="Hospitality Quotient" class="img-responsive halfsize">
                  </a>
                </li>
                <li id="menu-item-774" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-774"><a href="/who-we-are#join_our_team"><span>Join Our Team</span></a>
                </li>
                <li id="menu-item-682" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-682"><a href="https://app.e2ma.net/app2/audience/signup/68724/39157/"><span>Join Our Mailing List</span></a>
                </li>
                <li id="menu-item-709" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-709"><a href="http://216.213.81.216/?page_id=705"><span>Privacy Policy</span></a>
                </li>
              </ul>
            </div>© 2016 Hospitality Quotient</div>
        </div>
      </div>
    </div>
  </section>
</footer>

Answer 1

里面有很多代码。您能否提供您想要实现的目标的图片？

但是你肯定错过了第一行，这是肯定的。

<section class="container">
  <div class="row">
    <div class="col-md-12"></div>
  </div>
</section>

这将默认居中。