Bootstrap 3-图像在桌面中垂直左中对齐，在移动/平板电脑视图中居中

Question

我不是一个严格的CSS程序员，我需要帮助。在这个项目中，我有一个徽标，不知道如何居中返回的图像时，崩溃的md-3部分。

当网站在桌面视图or md-3；我想垂直对齐图像“左中间”，当它调整大小到or sm-3或or xs-3被定位到中间；。

这是URL；http://test2.supraz2000.com/

部分是..。

<div class="container">
    <div class"row">
        <!-- 1rst Row of 3 Top Header section -->    
        <div class="col-md-3 text-center" style="color:#FFFFFF; height:125px; padding-top:24px;">
            <a target="_blank" href="/"><img alt="SUPRAZ2000 INC." src="<%=get_skinurl()%>img/logo-supraz-fr.png"></a>
        </div>

        <!-- 2nd Row of 3 Top Header section -->
        <div class="col-md-6 text-center" style="color:#FFFFFF; height:125px; padding-top:18px; text-align:center;">
            <span style="text-align:center !important;"><a href="<%=get_StoreURL()%>shoppingcart.wws"><%= Minicart("cartinfo-total.wws") %></a></span>
            <span style="padding-right:5px;" class="glyphicon glyphicon-folder-open"></span>&nbsp;<a href="<%=get_StoreURL()%>customerdashboard.wws" style="color:#F3CE62;">Mon compte</a>&nbsp;&nbsp;&nbsp;&nbsp;<span style="padding-right:5px;" class="glyphicon glyphicon-search"></span>&nbsp;<a href="<%=get_StoreURL()%>customerorderhistory.wws" style="color:#F3CE62;">Retracez une commande</a>&nbsp;&nbsp;&nbsp;&nbsp;<span style="padding-right:5px;" class="glyphicon glyphicon-shopping-cart"></span>&nbsp;<a href="<%=get_StoreURL()%>validateshoppingcart.wws" style="color:#F3CE62;">Mon panier</a>
        </div>

        <!-- 3rd Row of 3 Top Header section -->
        <div class="col-md-3 text-center" style="height:125px; color:#FFFFFF; text-align:center; padding-top:16px;">
            <div class="text-center">
                <table width="250" height="90" border="0" cellspacing="0" cellpadding="0" align="center">
                    <tbody>
                        <tr>
                            <td style="background-image:url(img/telephone_tollfree-fr.png); background-repeat:no-repeat;">
                                <div id="tel" style="font-family:Gotham, 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:24px; color:#000000; letter-spacing:-1px; text-shadow:1px 1px #FFFFFF; padding-left:73px;"></div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

Answer 1

我终于自己找到了答案。

我需要重置CSS代码有关的“@媒体和”的屏幕分辨率和重新对齐的类别根据徽标需要的位置。