Problem with table-responsive, Help me pls

[GMButters]

jquery-confirm version: v3.3.0

I'm submitting a ... [x ] support request

Current behavior: The "table-responsive" class not work.

Related code:

var trPagos = "";
for (var i = 0; i < response.Pagos.length; i++) {
	trPagos += '<tr>'+
			'<td nowrap>xxxxxxxxx</td>'+
			'<td nowrap>xxxxxxxxx</td>'+
			'<td nowrap>xxxxxxxxx</td>'+
			'<td nowrap>xxxxxxxxx</td>'+
			'<td nowrap>xxxxxxxxx</td>'+
			'<td nowrap>xxxxxxxxx</td>'+
			'<td nowrap>xxxxxxxxx</td>'+
			'<td>xxxxxxxxx</td>'+
		'</tr>';
}
self.setContentAppend('<div class="col-xs-12 padding-none">'+
		'<div class="col-xs-12 padding-none">'+
			'<div class="table-responsive">'+
				'<table class="table table-bordered table-condensed table-hover">'+
					'<thead>'+
						'<tr>'+
							'<th>xxxxxxxxxxx</th>'+
							'<th>xxxxxxxxxxx</th>'+
							'<th>xxxxxxxxxxx</th>'+
							'<th>xxxxxxxxxxx</th>'+
							'<th>xxxxxxxxxxx</th>'+
							'<th>xxxxxxxxxxx</th>'+
							'<th>xxxxxxxxxxx</th>'+
							'<th>xxxxxxxxxxx</th>'+
						'</tr>'+
					'</thead>'+
					'<tbody>'+trPagos+'</tbody>'+
				'</table>'+
			'</div>'+
		'</div>'+
	'</div>');

Other information: width large

width small

[GMButters]

Temporary solution: in options

scrollToPreviousElement: false,

in onContentReady

dialPay.$el.find('.jconfirm-scrollpane').css('display', 'block');
dialPay.$el.find('.jconfirm-row').css('display', 'block');
dialPay.$el.find('.jconfirm-cell').css('display', 'block');

[craftpip]

I will look into this for sure.

[nuboxas]

same problem here as well. Any news on this issue?

[GMButters]

No, this slope, but, you can use the temporary solution that I put up

[AnasSafi]

Temporary solution:

const width = $(window).width();
$.confirm({
     boxWidth: (width < 700) ? (width - 50) + 'px' : 'auto',
     useBootstrap: (width < 700) ? false : true,
     columnClass: 'col-md-12',
});