«Перерыв» Таблица whit css, если возможно

-1

У меня есть таблица, которая динамически создается путем вытаскивания данных из SQL DB с помощью VBscript, а затем пересылается в HTML с помощью AJAX и JQuery.«Перерыв» Таблица whit css, если возможно

Это как мой HTML выглядит:

<table width="100%" style="border-collapse: collapse;"> 
     <tr bgcolor="#FF9933" > 
     <td width="50%" style="border-right:solid 1px black">TD 1</td> 
     <td width="50%">TD 2</td> 
     </tr> 
    </table> 
    <table id="UpdatePanel" width="100%" style="border-collapse: collapse;"> 
     </table>

Таблица с идентификатором «UpdatePanel» заполняется данными, динамически запряженных йоту Аякса.

Таблицы: Это как моя таблица выглядит, и как показали данные This is how my table looks and how the data is shown

Это, как я хочу, чтобы это выглядело, я хочу «сломать» это после того, как позволяет говорить 26-27 строк This is how i want it to look, i want to "break" it after lets say 26-27 rows

Я не знаю, можете ли вы выполнить это только с помощью CSS или CSS и JQuery или с чем-то еще.

источник

2016-03-22 MareCareSadJeStartuj

вы используете две таблицы прямо ... Вы можете изменить их ширину на '45%' каждый и попытаться использовать 'поплавок: left' .. –

Это было бы легко и я не буду нуждаться в вашей помощи :), да, я использую две таблицы, но один для имен столбцов и других данных. Если вы посмотрите на фотографии лучше, вы увидите, о чем я говорю. В любом случае. – MareCareSadJeStartuj

вы можете использовать элемент с несколькими элементами, который будет содержать 26/27 tr. эти элементы тела затем могут отображаться как ячейки или встроенные таблицы. http://codepen.io/gcyrillus/pen/grmqjB –

Это не то, что может сделать CSS, по крайней мере, чисто. Я рекомендую разбивать данные после успеха ajax и создавать несколько таблиц.

function createTables(data){ 
    var $tr = $(data)  
    var size = 26; 
    while($tr.length > 0){ 
     var table = $('<table></table>').append($tr.splice(0,size)) 
     $('body').append(table) 
    } 
}

float:left А потом или display:inline-block на ваших столах.

пример: https://jsfiddle.net/guanzo/rw59c65b/

источник

2016-03-22 01:48:30

display: inline-table, чтобы сохранить таблицу-макет эффективной .... так же, как я предложил через комментарии. сохранить th сверху можно также использовать https://jsfiddle.net/rw59c65b/1/;) –

@GCyrillus и Eric Guan большое спасибо. – MareCareSadJeStartuj

«Перерыв» Таблица whit css, если возможно

ответ

Смежные вопросы