嵌入式Twitter在响应模式下馈送页面

时间:2019-04-20 07:33:48

标签: bootstrap-4 embed

我在登录页面上添加了一个Twitter提要,当您减小屏幕尺寸时,该提要将显示在笔记本电脑,PC上,甚至在设计模式下也可以显示。但是,在我的手机上,Twitter提要比容器宽,并且使页面更大,并使其他容器的显示混乱。如何制作合适的尺寸? 这是我的网站www.wisbechinlinespeed.co.uk

和我的代码:

<style>
    .twitter {
        height: 100%;
    }
</style>

<div class="container">
    <div class="twitter">
        <div class="row">
            <div class="col-12 col-md-8">
                <div id="img">
                    <img class="img-fluid" src="team/033.jpg" height="100%" >
                </div>
            </div>

            <div class="col-12 col-md-4">
                <div class="row h-100">
                    <div class="col-12 adjust-height" width="100%">
                        <a class="twitter-timeline" height="485px" href="https://twitter.com/wisbechinline?ref_src=twsrc%5Etfw"><p>Tweets by Wisbech Inline Speed Skaters. If you can't view our Tweets here, Twitter may be blocked on your browser.Please check your tracking settings or click on the shield in the address bar to allow.</p></a> 
                        <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

0 个答案:

没有答案