javascript - Dynamically expanding width of a dynamically loaded DIV -


i've created tooltip loaded dynamically based on server side data. it's been working until got larger skus. there overflow.

i'm trying use either css or js dynamically change width eliminate overflow shown in this fiddle.

my html:

<div class="ext-tooltip 12345-789-1456789-431535" data-sku="12345-789-1456789-431535">   <div class="tooltip-stock">12345-789-1456789-431535 :: 5</div> </div> <div id="invoice-lines">     <div id="progress-container" class="hide" style="display: none;">         <div class="progress-bar-container">             <div id="progress-bar" class="progress-bar-progress" style="width: 100%;"></div>         </div>         <div class="example ta_center">loading...</div>     </div> <table cellspacing="0" id="invoice-time" class="invoice-lines spreadsheet" style="display:none"></table> 

my css:

.ext-tooltip {   display: inline-block;   background: url(//cdn.shopify.com/s/files/1/0059/3992/t/14/assets/oem-icon.png?17543244824127338148) -78px 0 no-repeat;   font-family: arial, sans-serif;   padding: 0 10px 7px 3px;   margin-left: 3px;   line-height: 22px;   overflow: hidden;   color: black;   font-weight: normal;   font-size: 9pt; } 

my js:

var $tooltip = $('.ext-tooltip.12345-789-1456789-431535');  $tooltip.innerwidth($('.tooltip-stock', $tooltip).innerwidth()); 

what's correct way this?

removing no-repeat background rule allows width adjust different lengths of text.

revised fiddle


Comments

Popular posts from this blog

how to insert data php javascript mysql with multiple array session 2 -

multithreading - Exception in Application constructor -

windows - CertCreateCertificateContext returns CRYPT_E_ASN1_BADTAG / 8009310b -