Html-таблица с указанием ширины столбцов в px не работает

Я пытаюсь создать таблицу с изменяемым размером столбцов ajax, интерфейс работает нормально, но когда я изменяю размер столбцов, браузер увеличивает таблицу максимум на 100%, в конечном итоге изменяя размер других столбцов. Я пробовал оба этих решения, но никто не работает хорошо:

1.

min-width: 100%;
table-layout: fixed;
width: 100%;

с этим решением мне нужно изменить размер любого отдельного столбца, прежде чем переходить (при необходимости) на 100%; например, если я увеличиваю только один столбец, все остальные столбцы ограничены, они не сохраняют исходную ширину (как я бы это сделал)

2.

table-layout: fixed;

Любые идеи?

Изменить: это соответствующий HTML-код:

<table class="resizable" id="TabellaDati" ><thead>  <tr>
    <th id="MDT_ThID"><span>ID</span></th>
    <th id="MDT_ThText"  style="width: 146px;">Text</th>
    <th id="MDT_ThTitle"  style="width: 148px;">Title</th>
    <th id="MDT_ThCssClass"  style="width: 83px;">CssClass</th>
    <th id="MDT_ThUrl"  style="width: 92px;">Url</th>
    <th id="MDT_ThOrdine">Ordine</th>
    </tr>
</thead>
<tbody> <tr>
    <td headers="MDT_ThID">MenuAlbo</td>
    <td headers="MDT_ThText">Albo Pretorio</td>
    <td headers="MDT_ThTitle">Albo Pretorio</td>
    <td headers="MDT_ThCssClass"></td>
    <td headers="MDT_ThUrl">/AlboPretorio</td>
    <td headers="MDT_ThOrdine">2</td>
    </tr>
</tbody></table>

И CSS:

#TabellaDati {
    min-width: 100%;
    table-layout: fixed;
    width: 100%;
}
table {
    border-collapse: collapse;
}

html css html-table width
person ʞᴉɯ    schedule 20.12.2010    source источник

Ответы (1)


arrow_upward
-1
arrow_downward

Пару дней назад я ответил на вопрос об установке ширины столбца с помощью css. Это может помочь сначала убедиться, что все настроено правильно. of-the-amount-of-text/4457905#4457905">Как установить ширину столбца таблицы.. В основном я обнаружил, что мне нужно установить ширину таблицы, а также th/td. После этого table-layout: fixed должен работать нормально.

EDIT:
Итак, я пропустил, что у вас была встроенная ширина ячейки. Итак, я загрузил вашу разметку и css, и это выглядит великолепно. (Я использую Хром)

Затем я был сбит с толку, в чем проблема, и поэтому я также понял, что это, скорее всего, проблема с AJAX. Я не так горяч с AJAX, но я все еще проверяю его.

ОБНОВЛЕНИЕ:
Есть ли причина, по которой вы должны использовать Ajax? То есть, какую выгоду вы получаете, используя AJAX вместо обычного Javascript, например:

var colText = document.getElementById('MDT_ThText');  
function setWidth(w) {  
 colText.style.width = w + "px";  
}

Я чувствую, что это было бы намного проще, и он остается хорошо отформатированным с разметкой и стилями, которые у вас есть.

Если вы непреклонны в использовании AJAX, укажите свой код относительно AJAX.

person ptpaterson    schedule 20.12.2010