पैनल के बाहर बूटस्ट्रैप 3 टेबल ओवरफ़्लो

Question

मैं एक पैनल के अंदर बूटस्ट्रैप तालिका का उपयोग कर रहा हूं, जो पैनल के बाहर अतिप्रवाह है यदि लंबी जानकारी है, तो यह कैसे ठीक किया जा सकता है?

<div class="col-sm-3" role="complementary"> 

<div class="panel panel-default"> 
    <div class="panel-body table-responsive"> 
    <table class="table table-bordered table-condensed f11"> 
     <tr> 
      <td colspan="2" align="center" class="info"><b>Info</b></td> 
     </tr> 
     <tr> 
      <td width="35%"><b>Agent</b></td> 
      <td width="65%">Luckystar Auto</td> 
     </tr> 
     <tr> 
      <td><b>WhatsApp</b></td> 
      <td>5412876542</td> 
     </tr> 
     <tr> 
      <td><b>WeChat</b></td> 
      <td>Luckystar88899</td> 
     </tr> 
     <tr> 
      <td><b>Facebook</b></td> 
      <td>www.facebook.com/luckystar88899-abcd</td> 
     </tr> 
    </table> 
    </div> 
</div> 

<div class="panel panel-default"> 
    <div class="panel-body"> 


     <p><div id="map-canvas"></div></p> 
    </div> 
</div> 

Answer 1

यह क्या होगा के बाद से URL लिंक बहुत चौड़ा है।

एक समाधान के रूप में की जरूरत सीएसएस अंडाकार उपयोग करने के लिए कक्ष सामग्री काटना है:

.table { 
    table-layout:fixed; 
} 

.table td { 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 

} 

डेमो: http://bootply.com/128979