在调整网站大小时,文本会超出div

时间:2018-05-29 09:16:05

标签: asp.net twitter-bootstrap

我正在转换现有网站,以便它具有响应性。我正在努力

http://dubaiexporters.com/member_benefits.aspx

当我调整浏览器大小时,文本会超出div。 enter image description here

我该怎么办,以便文字不会超出div?

代码:

<div class="roundedcornr_box">
        <div class="roundedcornr_top">
            <div>
            </div>
        </div>
        <div class="roundedcornr_content">
            <div class="postpage">
                <div class="customh1">
                    <h1 class="posthead">
                        Memberships & Benefits</h1>
                </div>
                <br />

                <div class="mainAdlistAds">
                    <div class="silverAds">
                         <div class="adContent" style="position:absolute;">
                            <ul><li><a href="pdf/Dubai_Exporters_Member_Certficate.pdf" target="_blank">DubaiExporters Membership Certificate </a></li> 
                                <li>Log in to access and edit the Company profile. </li>
                                <li>Access to the latest inquiries received from agents, importers, distributors all
                                    over the world.</li>
                                <li>Company’s Logo , profile & the website link in the Supplier’s section.</li>
                                <li>Advertisement of the Company shall be included in the Listing.</li>
                                <li>Weekly Newsletter updates from Dubai Exporters containing latest news about the
                                    world economy, export scenarios, upcoming projects, trade events, market reviews
                                    and the link to the Member’s Profile on Dubai Exporters, shall be mailed to our
                                    entire database of over 150000 Importers from Africa, CIS,Eastern Europe, latin
                                    America, Asia.&nbsp;<a class="lightbox" href="images/newslettertemplate.jpg">View sample</a></li>
                                <li>A CD of Dubai Exporters shall be distributed to all the trade visitors and importers
                                    visiting Int’l trade exhibitions where Dubai Exporters participates, thereby making
                                    your company’s information reach the right target audience. </li>
                            </ul>
                            <div style="float: right; padding:15px 60px 0px 0px;">
                                <asp:ImageButton ID="btSilver" runat="server" ImageUrl="images/mem_btn.png"
                                     /></div>
                        </div>
                    </div>
                </div>


            </div>

            </div>

        <div class="roundedcornr_bottom">
            <div>
            </div>
        </div>
    </div>

我是bootstrap的新手。任何帮助将受到高度赞赏。

2 个答案:

答案 0 :(得分:1)

因为此块的图像为灰色背景http://dubaiexporters.com/images/SILVER-member.jpg(具有自己的尺寸)并且在此块上设置了高度 - .silverAds { 高度:372px }

移除高度或将其转换为最小高度,然后对灰色图片进行扫描 - 在编辑器中垂直拉伸或添加带边框的背景颜色.silverAds

答案 1 :(得分:0)

如果您希望文本不显示在元素的边框上,则必须设置溢出。

.element { overflow: scroll;} 

.element { overflow: hidden;} 

编辑: 因为position: absolute正在从元素中取出内容。 您应该将父容器设置为position: relative&amp; height: auto;