分裂徘徊而不是筑巢 - 响应

Question

在一个网站上工作，这个网站本应具有响应能力，并且会出现一些看似不正常的错误。

我希望它的方式是缩小网站并将所有内容排成一行。

网址：http://profiledt.co.uk/SetTraining/

的index.php：

<div id="frontpage-Button-Cont">
<div id="Align-content">
<div class="button-cont">
<div class="thumbnail"><div class="title">Apprenticeships</div></div>
</div>

<div class="button-cont">
<div class="thumbnail red"><div class="title">CPD Online</div></div>
</div>


<div class="button-cont">
<div class="thumbnail orange"><div class="title">Courses</div></div>
</div>

<div class="button-cont">
<div class="thumbnail green"><div class="title">Job Shop</div></div>
</div>


</div>
<a class="twitter-timeline" href="https://twitter.com/Set_Training" data-widget-id="395882390205108224">Tweets by @Set_Training</a><script type="text/javascript">// <![CDATA[
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
// ]]></script>

exexcel，EDI和EU的部分是页脚。

    </div><!-- #main .wrapper -->
    <footer id="colophon" role="contentinfo">
        <div class="site-info">

<script type="text/javascript">
$(document).ready(function(){
    $('.ts-twentytwelve li').each(function(){
        var bg = $(this).css('background-image');
        bg = bg.replace('url("','').replace('")','');

        $(this).css({
            "filter": "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+bg+"', sizingMethod='scale')",
            "-ms-filter" : "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+bg+"', sizingMethod='scale')"
        });             
    });
});
</script>


<div class="footer-logos">
        <ul>
            <li><img src="/images/NAS.png" alt="" class="first"></li>
            <li><img src="/images/Kato.png" alt="" class=""></li>
            <li><img src="/images/MTA.png" alt="" class=""></li>
            <li><img src="/images/KCC.png" alt="" class=""></li>
        <li><img src="/images/SEAC.png" alt="" class=""></li> 
        <li><img src="/images/EdexcelLogo.png" alt="" class=""></li> 
        <li><img src="/images/edi_logo_alt.jpg" alt="" class=""></li> 
        <li><img src="/images/esf-logo-web.jpg" alt="" class="last"></li> 

        </ul>
</div>

Answer 1

我在<div id="frontpage-Button-Cont">元素上使用固定高度而不是'button-cont'类。

#frontpage-Button-Cont {
width: 100%;
/* height: 135px; */ //REMOVE THIS
text-align: center;
}