我有一张包含大量数据的表格。我有整个表的水平滚动条,我只想要tbody的垂直滚动条(Thead应该被修复)。
我能够实现滚动条和固定标题。但问题是在定义 thead,tbody {display:block} thead并且tbody没有正确对齐之后。
如果没有为各列设置宽度,有没有办法对齐?
.credits-table-wrapper {
overflow-x: auto;
}
.credits-table tbody, .credits-table thead {
display: block;
}
.credits-table tbody{
height:200px;
overflow-y:auto;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<div class="credits-table-wrapper container withscroll" id="yui_3_15_0_2_1517909025193_25">
<table class="table table-striped credits-table" id="yui_3_15_0_2_1517909025193_24">
<thead id="yui_3_15_0_2_1517909025193_23">
<tr id="yui_3_15_0_2_1517909025193_22">
<th>Supplier</th>
<th title="ILT cost for US per day per employee">US</th>
<th title="ILT cost for Canada per day per employee" id="yui_3_15_0_2_1517909025193_21">Canada</th>
<th title="ILT cost for India per day per employee">India</th>
<th title="ILT cost for Europe per day per employee">Europe</th>
<th title="ILT cost for China per day per employee">China</th>
<th title="ILT cost for Taiwan per day per employee">Taiwan</th>
<th>Online Self-Paced Cost</th>
<th>Remaining Cost</th>
<th>Budget Expiry Date</th>
<th>Year to Day Approved Cost</th>
<th>Year to Day(Spent)</th>
<th>Last Updated By</th>
<th>Last Updated Date</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr>
</tr><tr><td class="supplier_name">lynda</td><td class="supplier_name_input" style="display: none;"><input type="text" class="supplier_name_text" value="lynda"></td><td class="credit_us">123.00</td><td class="credit_us_input" style="display: none;"><input type="text" class="credit_us_text" value="123.00"></td><td class="credit_canada">123.00</td><td class="credit_canada_input" style="display: none;"><input type="text" class="credit_canada_text" value="123.00"></td><td class="credit_india">12.00</td><td class="credit_india_input" style="display: none;"><input type="text" class="credit_india_text" value="12.00"></td><td class="credit_europe">23.00</td><td class="credit_europe_input" style="display: none;"><input type="text" class="credit_europe_text" value="23.00"></td><td class="credit_china">11.00</td><td class="credit_china_input" style="display: none;"><input type="text" class="credit_china_text" value="11.00"></td><td class="credit_taiwan">12.00</td><td class="credit_taiwan_input" style="display: none;"><input type="text" class="credit_taiwan_text" value="12.00"></td><td class="credit_online">14.00</td><td class="credit_online_input" style="display: none;"><input type="text" class="credit_online_text" value="14.00"></td><td class="remaining_credit">984860.00</td><td class="remaining_credit_input" style="display: none;"><input type="text" class="remaining_credit_text" value="984860.00"></td><td class="expiry_date">02-28-2018</td><td class="expiry_date_input" style="display: none;"><input type="text" class="expiry_date_text hasDatepicker" value="02-28-2018" id="dp1517909025774"></td><td class="year_to_day_approved_cost">2709.00</td><td class="year_to_day_approved_cost_input" style="display: none;"><input type="text" class="year_to_day_approved_cost_text" value="2709.00"></td><td class="year_to_day_spent">0.00</td><td class="year_to_day_spent_input" style="display: none;"><input type="text" class="year_to_day_spent_text" value="0.00"></td><td class="updated_by">XXXXXXX</td><td class="updated_on">01-30-2018 11:22 PM</td><td><ul class="list-inline">
<li><a href="#" class="btn btn-default btn-xs credit-edit" data-toggle="modal" value="55" style="display: block;"> Edit</a></li>
<li><a href="#" class="btn btn-danger btn-xs credit-delete" data-toggle="modal" value="55" style="display: block;"> Delete</a></li>
<li><a href="#" class="btn btn-primary btn-xs credit-save" data-toggle="modal" value="55" style="display: none;"> Save</a></li>
<li><a href="#" class="btn btn-link btn-xs credit-cancel" data-toggle="modal" value="55" style="display: none;"> Cancel</a></li>
</ul></td></tr><tr><td class="supplier_name">Vendor_Dev</td><td class="supplier_name_input" style="display: none;"><input type="text" class="supplier_name_text" value="Vendor_Dev"></td><td class="credit_us">355.00</td><td class="credit_us_input" style="display: none;"><input type="text" class="credit_us_text" value="355.00"></td><td class="credit_canada">366.00</td><td class="credit_canada_input" style="display: none;"><input type="text" class="credit_canada_text" value="366.00"></td><td class="credit_india">377.00</td><td class="credit_india_input" style="display: none;"><input type="text" class="credit_india_text" value="377.00"></td><td class="credit_europe">455.00</td><td class="credit_europe_input" style="display: none;"><input type="text" class="credit_europe_text" value="455.00"></td><td class="credit_china">466.00</td><td class="credit_china_input" style="display: none;"><input type="text" class="credit_china_text" value="466.00"></td><td class="credit_taiwan">477.00</td><td class="credit_taiwan_input" style="display: none;"><input type="text" class="credit_taiwan_text" value="477.00"></td><td class="credit_online">999.00</td><td class="credit_online_input" style="display: none;"><input type="text" class="credit_online_text" value="999.00"></td><td class="remaining_credit">892288.00</td><td class="remaining_credit_input" style="display: none;"><input type="text" class="remaining_credit_text" value="892288.00"></td><td class="expiry_date">09-30-2018</td><td class="expiry_date_input" style="display: none;"><input type="text" class="expiry_date_text hasDatepicker" value="09-30-2018" id="dp1517909025775"></td><td class="year_to_day_approved_cost">14660.00</td><td class="year_to_day_approved_cost_input" style="display: none;"><input type="text" class="year_to_day_approved_cost_text" value="14660.00"></td><td class="year_to_day_spent">0.00</td><td class="year_to_day_spent_input" style="display: none;"><input type="text" class="year_to_day_spent_text" value="0.00"></td><td class="updated_by">XXXXXXX</td><td class="updated_on">01-30-2018 10:58 PM</td><td><ul class="list-inline">
<li><a href="#" class="btn btn-default btn-xs credit-edit" data-toggle="modal" value="61" style="display: block;"> Edit</a></li>
<li><a href="#" class="btn btn-danger btn-xs credit-delete" data-toggle="modal" value="61" style="display: block;"> Delete</a></li>
<li><a href="#" class="btn btn-primary btn-xs credit-save" data-toggle="modal" value="61" style="display: none;"> Save</a></li>
<li><a href="#" class="btn btn-link btn-xs credit-cancel" data-toggle="modal" value="61" style="display: none;"> Cancel</a></li>
</ul></td></tr><tr><td class="supplier_name">cost_keerthi4</td><td class="supplier_name_input" style="display: none;"><input type="text" class="supplier_name_text" value="cost_keerthi4"></td><td class="credit_us">254.00</td><td class="credit_us_input" style="display: none;"><input type="text" class="credit_us_text" value="254.00"></td><td class="credit_canada">365.00</td><td class="credit_canada_input" style="display: none;"><input type="text" class="credit_canada_text" value="365.00"></td><td class="credit_india">134.00</td><td class="credit_india_input" style="display: none;"><input type="text" class="credit_india_text" value="134.00"></td><td class="credit_europe">256.00</td><td class="credit_europe_input" style="display: none;"><input type="text" class="credit_europe_text" value="256.00"></td><td class="credit_china">187.00</td><td class="credit_china_input" style="display: none;"><input type="text" class="credit_china_text" value="187.00"></td><td class="credit_taiwan">654.00</td><td class="credit_taiwan_input" style="display: none;"><input type="text" class="credit_taiwan_text" value="654.00"></td><td class="credit_online">123.00</td><td class="credit_online_input" style="display: none;"><input type="text" class="credit_online_text" value="123.00"></td><td class="remaining_credit">4403.00</td><td class="remaining_credit_input" style="display: none;"><input type="text" class="remaining_credit_text" value="4403.00"></td><td class="expiry_date">04-28-2018</td><td class="expiry_date_input" style="display: none;"><input type="text" class="expiry_date_text hasDatepicker" value="04-28-2018" id="dp1517909025776"></td><td class="year_to_day_approved_cost">10954.00</td><td class="year_to_day_approved_cost_input" style="display: none;"><input type="text" class="year_to_day_approved_cost_text" value="10954.00"></td><td class="year_to_day_spent">0.00</td><td class="year_to_day_spent_input" style="display: none;"><input type="text" class="year_to_day_spent_text" value="0.00"></td><td class="updated_by">Prashanthini Janakiram</td><td class="updated_on">02-05-2018 07:29 AM</td><td><ul class="list-inline">
<li><a href="#" class="btn btn-default btn-xs credit-edit" data-toggle="modal" value="63" style="display: block;"> Edit</a></li>
<li><a href="#" class="btn btn-danger btn-xs credit-delete" data-toggle="modal" value="63" style="display: block;"> Delete</a></li>
<li><a href="#" class="btn btn-primary btn-xs credit-save" data-toggle="modal" value="63" style="display: none;"> Save</a></li>
<li><a href="#" class="btn btn-link btn-xs credit-cancel" data-toggle="modal" value="63" style="display: none;"> Cancel</a></li>
</ul></td></tr><tr><td class="supplier_name">Ani</td><td class="supplier_name_input" style="display: none;"><input type="text" class="supplier_name_text" value="Ani"></td><td class="credit_us">378.00</td><td class="credit_us_input" style="display: none;"><input type="text" class="credit_us_text" value="378.00"></td><td class="credit_canada">673.00</td><td class="credit_canada_input" style="display: none;"><input type="text" class="credit_canada_text" value="673.00"></td><td class="credit_india">456.00</td><td class="credit_india_input" style="display: none;"><input type="text" class="credit_india_text" value="456.00"></td><td class="credit_europe">895.00</td><td class="credit_europe_input" style="display: none;"><input type="text" class="credit_europe_text" value="895.00"></td><td class="credit_china">476.00</td><td class="credit_china_input" style="display: none;"><input type="text" class="credit_china_text" value="476.00"></td><td class="credit_taiwan">235.00</td><td class="credit_taiwan_input" style="display: none;"><input type="text" class="credit_taiwan_text" value="235.00"></td><td class="credit_online">575.00</td><td class="credit_online_input" style="display: none;"><input type="text" class="credit_online_text" value="575.00"></td><td class="remaining_credit">81844.00</td><td class="remaining_credit_input" style="display: none;"><input type="text" class="remaining_credit_text" value="81844.00"></td><td class="expiry_date">05-31-2019</td><td class="expiry_date_input" style="display: none;"><input type="text" class="expiry_date_text hasDatepicker" value="05-31-2019" id="dp1517909025777"></td><td class="year_to_day_approved_cost">8156.00</td><td class="year_to_day_approved_cost_input" style="display: none;"><input type="text" class="year_to_day_approved_cost_text" value="8156.00"></td><td class="year_to_day_spent">0.00</td><td class="year_to_day_spent_input" style="display: none;"><input type="text" class="year_to_day_spent_text" value="0.00"></td><td class="updated_by">XXXXXXX</td><td class="updated_on">01-31-2018 03:53 AM</td><td><ul class="list-inline">
<li><a href="#" class="btn btn-default btn-xs credit-edit" data-toggle="modal" value="66" style="display: block;"> Edit</a></li>
<li><a href="#" class="btn btn-danger btn-xs credit-delete" data-toggle="modal" value="66" style="display: block;"> Delete</a></li>
<li><a href="#" class="btn btn-primary btn-xs credit-save" data-toggle="modal" value="66" style="display: none;"> Save</a></li>
<li><a href="#" class="btn btn-link btn-xs credit-cancel" data-toggle="modal" value="66" style="display: none;"> Cancel</a></li>
</ul></td></tr><tr><td class="supplier_name">AniConcurrent</td><td class="supplier_name_input" style="display: none;"><input type="text" class="supplier_name_text" value="AniConcurrent"></td><td class="credit_us">874.00</td><td class="credit_us_input" style="display: none;"><input type="text" class="credit_us_text" value="874.00"></td><td class="credit_canada">435.00</td><td class="credit_canada_input" style="display: none;"><input type="text" class="credit_canada_text" value="435.00"></td><td class="credit_india">567.00</td><td class="credit_india_input" style="display: none;"><input type="text" class="credit_india_text" value="567.00"></td><td class="credit_europe">378.00</td><td class="credit_europe_input" style="display: none;"><input type="text" class="credit_europe_text" value="378.00"></td><td class="credit_china">735.00</td><td class="credit_china_input" style="display: none;"><input type="text" class="credit_china_text" value="735.00"></td><td class="credit_taiwan">356.00</td><td class="credit_taiwan_input" style="display: none;"><input type="text" class="credit_taiwan_text" value="356.00"></td><td class="credit_online">134.00</td><td class="credit_online_input" style="display: none;"><input type="text" class="credit_online_text" value="134.00"></td><td class="remaining_credit">100000.00</td><td class="remaining_credit_input" style="display: none;"><input type="text" class="remaining_credit_text" value="100000.00"></td><td class="expiry_date">06-30-2019</td><td class="expiry_date_input" style="display: none;"><input type="text" class="expiry_date_text hasDatepicker" value="06-30-2019" id="dp1517909025778"></td><td class="year_to_day_approved_cost">0.00</td><td class="year_to_day_approved_cost_input" style="display: none;"><input type="text" class="year_to_day_approved_cost_text" value="0.00"></td><td class="year_to_day_spent">0.00</td><td class="year_to_day_spent_input" style="display: none;"><input type="text" class="year_to_day_spent_text" value="0.00"></td><td class="updated_by">XXXXXXX</td><td class="updated_on">02-01-2018 01:39 AM</td><td><ul class="list-inline">
<li><a href="#" class="btn btn-default btn-xs credit-edit" data-toggle="modal" value="68" style="display: block;"> Edit</a></li>
<li><a href="#" class="btn btn-danger btn-xs credit-delete" data-toggle="modal" value="68" style="display: block;"> Delete</a></li>
<li><a href="#" class="btn btn-primary btn-xs credit-save" data-toggle="modal" value="68" style="display: none;"> Save</a></li>
<li><a href="#" class="btn btn-link btn-xs credit-cancel" data-toggle="modal" value="68" style="display: none;"> Cancel</a></li>
</ul></td></tr><tr><td class="supplier_name">test_vendor_keerthi</td><td class="supplier_name_input" style="display: none;"><input type="text" class="supplier_name_text" value="test_vendor_keerthi"></td><td class="credit_us">123.00</td><td class="credit_us_input" style="display: none;"><input type="text" class="credit_us_text" value="123.00"></td><td class="credit_canada">234.00</td><td class="credit_canada_input" style="display: none;"><input type="text" class="credit_canada_text" value="234.00"></td><td class="credit_india">345.00</td><td class="credit_india_input" style="display: none;"><input type="text" class="credit_india_text" value="345.00"></td><td class="credit_europe">456.00</td><td class="credit_europe_input" style="display: none;"><input type="text" class="credit_europe_text" value="456.00"></td><td class="credit_china">567.00</td><td class="credit_china_input" style="display: none;"><input type="text" class="credit_china_text" value="567.00"></td><td class="credit_taiwan">678.00</td><td class="credit_taiwan_input" style="display: none;"><input type="text" class="credit_taiwan_text" value="678.00"></td><td class="credit_online">789.00</td><td class="credit_online_input" style="display: none;"><input type="text" class="credit_online_text" value="789.00"></td><td class="remaining_credit">500000.00</td><td class="remaining_credit_input" style="display: none;"><input type="text" class="remaining_credit_text" value="500000.00"></td><td class="expiry_date">05-31-2018</td><td class="expiry_date_input" style="display: none;"><input type="text" class="expiry_date_text hasDatepicker" value="05-31-2018" id="dp1517909025779"></td><td class="year_to_day_approved_cost">0.00</td><td class="year_to_day_approved_cost_input" style="display: none;"><input type="text" class="year_to_day_approved_cost_text" value="0.00"></td><td class="year_to_day_spent">0.00</td><td class="year_to_day_spent_input" style="display: none;"><input type="text" class="year_to_day_spent_text" value="0.00"></td><td class="updated_by">Prashanthini Janakiram</td><td class="updated_on">02-04-2018 11:57 PM</td><td><ul class="list-inline">
<li><a href="#" class="btn btn-default btn-xs credit-edit" data-toggle="modal" value="72" style="display: block;"> Edit</a></li>
<li><a href="#" class="btn btn-danger btn-xs credit-delete" data-toggle="modal" value="72" style="display: block;"> Delete</a></li>
<li><a href="#" class="btn btn-primary btn-xs credit-save" data-toggle="modal" value="72" style="display: none;"> Save</a></li>
<li><a href="#" class="btn btn-link btn-xs credit-cancel" data-toggle="modal" value="72" style="display: none;"> Cancel</a></li>
</ul></td></tr><tr><td class="supplier_name">VerifyDelete</td><td class="supplier_name_input" style="display: none;"><input type="text" class="supplier_name_text" value="VerifyDelete"></td><td class="credit_us">100.00</td><td class="credit_us_input" style="display: none;"><input type="text" class="credit_us_text" value="100.00"></td><td class="credit_canada">100.00</td><td class="credit_canada_input" style="display: none;"><input type="text" class="credit_canada_text" value="100.00"></td><td class="credit_india">100.00</td><td class="credit_india_input" style="display: none;"><input type="text" class="credit_india_text" value="100.00"></td><td class="credit_europe">100.00</td><td class="credit_europe_input" style="display: none;"><input type="text" class="credit_europe_text" value="100.00"></td><td class="credit_china">100.00</td><td class="credit_china_input" style="display: none;"><input type="text" class="credit_china_text" value="100.00"></td><td class="credit_taiwan">100.00</td><td class="credit_taiwan_input" style="display: none;"><input type="text" class="credit_taiwan_text" value="100.00"></td><td class="credit_online">100.00</td><td class="credit_online_input" style="display: none;"><input type="text" class="credit_online_text" value="100.00"></td><td class="remaining_credit">599800.00</td><td class="remaining_credit_input" style="display: none;"><input type="text" class="remaining_credit_text" value="599800.00"></td><td class="expiry_date">09-30-2018</td><td class="expiry_date_input" style="display: none;"><input type="text" class="expiry_date_text hasDatepicker" value="09-30-2018" id="dp1517909025780"></td><td class="year_to_day_approved_cost">200.00</td><td class="year_to_day_approved_cost_input" style="display: none;"><input type="text" class="year_to_day_approved_cost_text" value="200.00"></td><td class="year_to_day_spent">0.00</td><td class="year_to_day_spent_input" style="display: none;"><input type="text" class="year_to_day_spent_text" value="0.00"></td><td class="updated_by">XXXXXXX</td><td class="updated_on">02-05-2018 02:52 AM</td><td><ul class="list-inline">
<li><a href="#" class="btn btn-default btn-xs credit-edit" data-toggle="modal" value="73" style="display: block;"> Edit</a></li>
<li><a href="#" class="btn btn-danger btn-xs credit-delete" data-toggle="modal" value="73" style="display: block;"> Delete</a></li>
<li><a href="#" class="btn btn-primary btn-xs credit-save" data-toggle="modal" value="73" style="display: none;"> Save</a></li>
<li><a href="#" class="btn btn-link btn-xs credit-cancel" data-toggle="modal" value="73" style="display: none;"> Cancel</a></li>
</ul></td></tr><tr><td class="supplier_name">test_vendor_keerthi2</td><td class="supplier_name_input" style="display: none;"><input type="text" class="supplier_name_text" value="test_vendor_keerthi2"></td><td class="credit_us">123.00</td><td class="credit_us_input" style="display: none;"><input type="text" class="credit_us_text" value="123.00"></td><td class="credit_canada">234.00</td><td class="credit_canada_input" style="display: none;"><input type="text" class="credit_canada_text" value="234.00"></td><td class="credit_india">345.00</td><td class="credit_india_input" style="display: none;"><input type="text" class="credit_india_text" value="345.00"></td><td class="credit_europe">456.00</td><td class="credit_europe_input" style="display: none;"><input type="text" class="credit_europe_text" value="456.00"></td><td class="credit_china">567.00</td><td class="credit_china_input" style="display: none;"><input type="text" class="credit_china_text" value="567.00"></td><td class="credit_taiwan">678.00</td><td class="credit_taiwan_input" style="display: none;"><input type="text" class="credit_taiwan_text" value="678.00"></td><td class="credit_online">789.00</td><td class="credit_online_input" style="display: none;"><input type="text" class="credit_online_text" value="789.00"></td><td class="remaining_credit">498128.00</td><td class="remaining_credit_input" style="display: none;"><input type="text" class="remaining_credit_text" value="498128.00"></td><td class="expiry_date">05-31-2018</td><td class="expiry_date_input" style="display: none;"><input type="text" class="expiry_date_text hasDatepicker" value="05-31-2018" id="dp1517909025781"></td><td class="year_to_day_approved_cost">1872.00</td><td class="year_to_day_approved_cost_input" style="display: none;"><input type="text" class="year_to_day_approved_cost_text" value="1872.00"></td><td class="year_to_day_spent">0.00</td><td class="year_to_day_spent_input" style="display: none;"><input type="text" class="year_to_day_spent_text" value="0.00"></td><td class="updated_by">Prashanthini Janakiram</td><td class="updated_on">02-05-2018 02:56 AM</td><td><ul class="list-inline">
<li><a href="#" class="btn btn-default btn-xs credit-edit" data-toggle="modal" value="74" style="display: block;"> Edit</a></li>
<li><a href="#" class="btn btn-danger btn-xs credit-delete" data-toggle="modal" value="74" style="display: block;"> Delete</a></li>
<li><a href="#" class="btn btn-primary btn-xs credit-save" data-toggle="modal" value="74" style="display: none;"> Save</a></li>
<li><a href="#" class="btn btn-link btn-xs credit-cancel" data-toggle="modal" value="74" style="display: none;"> Cancel</a></li>
</ul></td></tr><tr><td class="supplier_name">test_vendor_keerthi7</td><td class="supplier_name_input" style="display: none;"><input type="text" class="supplier_name_text" value="test_vendor_keerthi7"></td><td class="credit_us">1.00</td><td class="credit_us_input" style="display: none;"><input type="text" class="credit_us_text" value="1.00"></td><td class="credit_canada">1.00</td><td class="credit_canada_input" style="display: none;"><input type="text" class="credit_canada_text" value="1.00"></td><td class="credit_india">1.00</td><td class="credit_india_input" style="display: none;"><input type="text" class="credit_india_text" value="1.00"></td><td class="credit_europe">1.00</td><td class="credit_europe_input" style="display: none;"><input type="text" class="credit_europe_text" value="1.00"></td><td class="credit_china">1.00</td><td class="credit_china_input" style="display: none;"><input type="text" class="credit_china_text" value="1.00"></td><td class="credit_taiwan">1.00</td><td class="credit_taiwan_input" style="display: none;"><input type="text" class="credit_taiwan_text" value="1.00"></td><td class="credit_online">1.00</td><td class="credit_online_input" style="display: none;"><input type="text" class="credit_online_text" value="1.00"></td><td class="remaining_credit">299998.00</td><td class="remaining_credit_input" style="display: none;"><input type="text" class="remaining_credit_text" value="299998.00"></td><td class="expiry_date">05-31-2018</td><td class="expiry_date_input" style="display: none;"><input type="text" class="expiry_date_text hasDatepicker" value="05-31-2018" id="dp1517909025782"></td><td class="year_to_day_approved_cost">3.00</td><td class="year_to_day_approved_cost_input" style="display: none;"><input type="text" class="year_to_day_approved_cost_text" value="3.00"></td><td class="year_to_day_spent">0.00</td><td class="year_to_day_spent_input" style="display: none;"><input type="text" class="year_to_day_spent_text" value="0.00"></td><td class="updated_by">Prashanthini Janakiram</td><td class="updated_on">02-06-2018 01:16 AM</td><td><ul class="list-inline">
<li><a href="#" class="btn btn-default btn-xs credit-edit" data-toggle="modal" value="75" style="display: block;"> Edit</a></li>
<li><a href="#" class="btn btn-danger btn-xs credit-delete" data-toggle="modal" value="75" style="display: block;"> Delete</a></li>
<li><a href="#" class="btn btn-primary btn-xs credit-save" data-toggle="modal" value="75" style="display: none;"> Save</a></li>
<li><a href="#" class="btn btn-link btn-xs credit-cancel" data-toggle="modal" value="75" style="display: none;"> Cancel</a></li>
</ul></td></tr><tr><td class="supplier_name">DelAni</td><td class="supplier_name_input" style="display: none;"><input type="text" class="supplier_name_text" value="DelAni"></td><td class="credit_us">100.00</td><td class="credit_us_input" style="display: none;"><input type="text" class="credit_us_text" value="100.00"></td><td class="credit_canada">200.00</td><td class="credit_canada_input" style="display: none;"><input type="text" class="credit_canada_text" value="200.00"></td><td class="credit_india">300.00</td><td class="credit_india_input" style="display: none;"><input type="text" class="credit_india_text" value="300.00"></td><td class="credit_europe">400.00</td><td class="credit_europe_input" style="display: none;"><input type="text" class="credit_europe_text" value="400.00"></td><td class="credit_china">500.00</td><td class="credit_china_input" style="display: none;"><input type="text" class="credit_china_text" value="500.00"></td><td class="credit_taiwan">600.00</td><td class="credit_taiwan_input" style="display: none;"><input type="text" class="credit_taiwan_text" value="600.00"></td><td class="credit_online">700.00</td><td class="credit_online_input" style="display: none;"><input type="text" class="credit_online_text" value="700.00"></td><td class="remaining_credit">70000000.00</td><td class="remaining_credit_input" style="display: none;"><input type="text" class="remaining_credit_text" value="70000000.00"></td><td class="expiry_date">12-29-2018</td><td class="expiry_date_input" style="display: none;"><input type="text" class="expiry_date_text hasDatepicker" value="12-29-2018" id="dp1517909025783"></td><td class="year_to_day_approved_cost">0.00</td><td class="year_to_day_approved_cost_input" style="display: none;"><input type="text" class="year_to_day_approved_cost_text" value="0.00"></td><td class="year_to_day_spent">0.00</td><td class="year_to_day_spent_input" style="display: none;"><input type="text" class="year_to_day_spent_text" value="0.00"></td><td class="updated_by">XXXXXXX</td><td class="updated_on">02-05-2018 07:06 AM</td><td><ul class="list-inline">
<li><a href="#" class="btn btn-default btn-xs credit-edit" data-toggle="modal" value="76" style="display: block;"> Edit</a></li>
<li><a href="#" class="btn btn-danger btn-xs credit-delete" data-toggle="modal" value="76" style="display: block;"> Delete</a></li>
<li><a href="#" class="btn btn-primary btn-xs credit-save" data-toggle="modal" value="76" style="display: none;"> Save</a></li>
<li><a href="#" class="btn btn-link btn-xs credit-cancel" data-toggle="modal" value="76" style="display: none;"> Cancel</a></li>
</ul></td></tr></tbody>
</table>
</div>