Javascript-форум (https://javascript.ru/forum/)
-   (X)HTML/CSS (https://javascript.ru/forum/xhtml-html-css/)
-   -   ширина колонки таблицы по количеству колонок (https://javascript.ru/forum/xhtml-html-css/45163-shirina-kolonki-tablicy-po-kolichestvu-kolonok.html)

yriiarutiunian 17.02.2014 16:13

ширина колонки таблицы по количеству колонок
 
Здравствуйте, подскажите пожалуйста как задать свойство для таблицы чтобы ширина колонок расчитывалась как - ШИРИНА ТАБЛИЦЫ / КОЛИЧЕСТВО КОЛОНОК.
Т. е. выставлялась вне зависимости от длины содержимого?
Спасибо.

BETEPAH 17.02.2014 17:07

Без примера не понятна суть задачи. Задайте в css ширину. Или количество колонок и ширина таблицы могут меняться? Тогда как-то так можно:
<style>
table td {
border: 1px solid gray;
}
</style>
<table style="width: 300px">
<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
</table>
<script>
var table = document.getElementsByTagName('table')[0];
var widthTable = parseFloat(table.style.width);
var cols = table.getElementsByTagName('tr')[0].getElementsByTagName('td');
var numCols = cols.length;
for (var i = 0; i < numCols; i++) {
cols[i].style.width = widthTable / numCols;
}
</script>

danik.js 17.02.2014 17:37

Проблемы верстки решают скриптами только мудаки!!! Ну блин, сколько можно-то, а?
Автор, пробуй так.
<!DOCTYPE html>
<html>
<style>
table{
    width: 400px;
    table-layout: fixed;
}
</style>
<table border="1">
    <tr>
        <td>abc</td>
        <td>abc</td>
        <td>ab</td>
        <td>sssssssssssssssssssssssssssss s fdfsdf</td>
    </tr>
</table>

yriiarutiunian 18.02.2014 11:10

danik.js, Спасибо. Сработало

kostyanet 21.02.2014 22:22

table-layout: fixed;

По моему оно вообще не сеет. Единственное в ИЕ8 я увидел фиксед в одной своей таблицы в одну из последних попыток проверить как оно в ИЕ. ФФ и Хром тянут куда попало по контенту пилюя на всё. Даже если профтыкать оверфлоу - все равно.

Может только для таблицы содержание которой не противоречит атрибуту. Ну вот эти ааа, ббб, ссс и тпп.

Суть фикседа в инкрементном рендере таблицы. Типа поскольку ширина колонок заранее известна рендерить ее можно по мере поступления данных. Иначе надо закачать все, рассчитать ширину всех и тогда уж.

Ну вот, w3c много интересного пишет про таблицы и надо сказать не все что там с древности зафиксировано реализовано или еще работает в браузерах. Например col style="display:none" = х нанэ. ЧТо-то еще пытался сделать через <colgroup><col>... и обломился и забыл уже что.

Но пропорциональное определение ширины вроде пашет.

http://www.w3.org/TR/html401/struct/...tml#h-11.2.4.2

Устроено так. Задаете ширину 1 колонки явным образом, скажем 30 пикселов (через col конечно), а другие колы забиваете пропорциями, синтаксис х*. Например первая 20 пикс, вторая 2*, затем 4*, 3*, 1*. Что в принципе означает 2*20, 4*20 и тп, и дает 20, 40, 80, 60, 20.

То есть задав первой 50 пикс, а всем остальнам 1* вы получите фиксед который регулируется через 1 множимое.

kostyanet 21.02.2014 22:28

Вот так примерно, с сайта переделал.

<TABLE>
<COLGROUP>
   <COL width="30">
   <COL width="1*">
   <COL width="1*">
   <COL width="1*">
   <COL width="1*">
   <COL width="1*">
   <COL width="1*">
<THEAD>
<TR><TD> ...
...rows...
</TABLE>


COL точно помню не надо закрывать, COLGROUP опционально. Если он нормально закрывается - можно не, но поскольку он закрывается нормально всегда, то значит не надо.

Кстати, tr, th, td не требуется закрывать в нормальной верстке. Они автозакрывающиеся. tr закрывает tr, td - следующий td. Но если вы начнете брать текст с td в js как есть, то с незакрытого вам почему-то \n прилетит.

danik.js 21.02.2014 22:46

kostyanet, что-то у меня не получаются одинаковые колонки из твоего кода. Можешь демку состряпать? Фишка конечно интересная, хоть и устаревшая.
Цитата:

Сообщение от kostyanet
COL точно помню не надо закрывать

Надо. Все надо закрывать если не желаешь себе геморроя. Тем более закрывать не тебе, а твоему текстовому редактору. Но вобще, да, эти закрывающие теги опциональны.

Цитата:

Сообщение от kostyanet
почему-то \n прилетит

Почему-то? Помоему это очевидно, чему ты удивляешься?

kostyanet 22.02.2014 06:33

Значит и это не работает. Есть теория что и фиксед не работает по той же причине.

Мне надо было скрывать колонки в таблице, которые написано скрывать. Ну вот, пришлось через бесконечные td class="hidden" сделать. col'ы вообще похоже теперь не обслуживаются.

kostyanet 22.02.2014 06:35

Цитата:

Сообщение от danik.js
Почему-то? Помоему это очевидно, чему ты удивляешься?

В теории межтеговый газ не должен проникать в теги. Он и не проникает если теги закрыты сами собой, а не спинами соседей, иначе просачивается.

danik.js 22.02.2014 10:46

Цитата:

Сообщение от kostyanet
Он и не проникает если теги закрыты сами собой, а не спинами соседей, иначе просачивается.

Если ты закрыл тег до переноса строки - то он и не попадает в тег. А если не закрыл - тег закроется сам только когда встретит следующий открывающий, а это уже после переноса. Я думаю ты и сам уже понял.


Часовой пояс GMT +3, время: 23:01.