簡體   English   中英

div文字即將用完DIV

[英]Div text is going out of DIV

我有一排下面的代碼,然后里面有幾個文本框和按鈕。

但是文本不在div中。 嘗試了溢出屬性,但沒有幫助。

<div class ="row no-gutter">        
        <div class ="col-sm-12" style="margin:8px 0px 0px 0px;padding-left:8px;padding-right:8px;">                         
                <div class ="row">
                    <div class ="col-sm-6" style="margin:8px 0px 0px 0px;padding-left:30px;padding-right:30px;">
                        <div id="MainContent_UpdatePanelCentrifugeSpinAndStep" >                                   
                                            <div class ="row">                                                                                  
                                                <div class ="col-sm-4 text-center" style="margin:2px 0px 0px 0px;padding-right:0px;">
                                                    <div class="form-control input-md" >
                                                        <input id="MainContent_chkLastCycle"  type="checkbox" name="ctl00$MainContent$chkLastCycle" />
                                                        End Day Production Re-set
                                                    </div>
                                                </div>
                                            </div>

                                        </div>
                                    </div>                            
</div>

這是相同的小提琴: https : //jsfiddle.net/2zfp3g4g/

在此處輸入圖片說明

overflow:hidden正在工作。 您將溢出屬性賦予復選框父div。

 <link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <div class ="row no-gutter"> <div class ="col-sm-12" style="margin:8px 0px 0px 0px;padding-left:8px;padding-right:8px;"> <div class ="row"> <div class ="col-sm-6" style="margin:8px 0px 0px 0px;padding-left:30px;padding-right:30px;"> <div id="MainContent_UpdatePanelCentrifugeSpinAndStep" > <div class ="row"> <div class ="col-sm-4 text-center" style="margin:2px 0px 0px 0px;padding-right:0px;"> <div class="form-control input-md" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;" > <input id="MainContent_chkLastCycle" type="checkbox" name="ctl00$MainContent$chkLastCycle" /> End Day Production Re-set </div> </div> </div> </div> </div> </div> 

似乎該復選框處於display: block 也許將其設置為display: inline解決它。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM