Jump to content
  • 0

Ширины таблиц с данными


orgi
 Share

Question

Добрый день.

Возникла проблема с таблицами, в которых размещаются данные. На странице несколько таблиц и хочется чтобы ширина столбцов во всех была одинаковой.

НО! по непонятной мне причине они все разные. особенно в IE6, там расколбашивает как хочет табличку (я это так и заметила, тк во всех остальных браузерах было нормально, хотя значения ширины были все разными О_о)

наглядно на скриншоте видно:

1.jpg

здесь одинаковые только первые значения, а у третьей значения вообще другие, но отображается она ровно (за искл ИЕ6)

а вот второй рисунок, где все значения одинаковы вроде, но теперь третья табличка кривая (хотя я сложила сумму 2х столбцев)

2.jpg

из-за чего это может быть? и как сделать чтобы везде было одинаково и норм отображалось в ие6 при этом.

приведу код:

первый вариант:

<table id="table" width="680">

<thead>
<tr>
<th width="15px">№</th>
<th width="230px">Наименование</th>
<th width="23px">Ток, А</th>
<th width="30px">Цвет</th>
<th width="50px">Фаза</th>
<th width="48px">Сечение кабеля, мм<sup>2</sup></th>
<th width="284px">Описание</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td>POWERLOCK NLS-E-GN-S120-M40A</td>
<td>400</td>
<td><img src="images/green.jpg" border="0" width="28"></td>
<td>земля</td>
<td>до 120</td>
<td>Розетка на кабель, крепление под винт, уплотнительная кабельная муфта 19-28мм</td>
</tr>

</tbody>
</table>
<table id="table" width="680">

<thead>
<tr>
<th width="15px">№</th>
<th width="230px">Наименование</th>
<th width="23px">Ток, А</th>
<th width="30px">Цвет</th>
<th width="50px">Фаза</th>
<th width="48px">Сечение кабеля, мм<sup>2</sup></th>
<th width="284px">Описание</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td>POWERLOCK NLD-FT-E-GN-L-S120-M40A</td>
<td>400</td>
<td><img src="images/green.jpg" border="0" width="28"></td>
<td>земля</td>
<td>до 120</td>
<td>Штекер на кабель, с защитой от неправильного соединения и прикосновения, крепление под винт, уплотнительная кабельная муфта 19-28мм</td>
</tr>

</tbody>
</table>
<table id="table" width="680">

<thead>
<tr>
<th width="10px">№</th>
<th width="220px">Наименование</th>
<th width="20px">Ток, А</th>
<th width="30px">Цвет</th>
<th width="50px">Фаза</th>
<th width="350px">Описание</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td>POWERLOCK NPS-E-GN-T4</td>
<td>400</td>
<td><img src="images/green.jpg" border="0" width="28"></td>
<td>земля</td>
<td>Розетка на панель, резьбовое отверстие М12 на 400А</td>
</tr>
</tbody>
</table>

второй вариант, где все значения одинаковы, а результат разный

 <table id="table" width="680">

<thead>
<tr>
<th width="15px">№</th>
<th width="230px">Наименование</th>
<th width="23px">Ток, А</th>
<th width="30px">Цвет</th>
<th width="50px">Фаза</th>
<th width="48px">Сечение кабеля, мм<sup>2</sup></th>
<th width="284px">Описание</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td>POWERLOCK NLS-E-GN-S120-M40A</td>
<td>400</td>
<td><img src="images/green.jpg" border="0" width="28"></td>
<td>земля</td>
<td>до 120</td>
<td>Розетка на кабель, крепление под винт, уплотнительная кабельная муфта 19-28мм</td>
</tr>

</tbody>
</table>
<table id="table" width="680">

<thead>
<tr>
<th width="15px">№</th>
<th width="230px">Наименование</th>
<th width="23px">Ток, А</th>
<th width="30px">Цвет</th>
<th width="50px">Фаза</th>
<th width="48px">Сечение кабеля, мм<sup>2</sup></th>
<th width="284px">Описание</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td>POWERLOCK NLD-FT-E-GN-L-S120-M40A</td>
<td>400</td>
<td><img src="images/green.jpg" border="0" width="28"></td>
<td>земля</td>
<td>до 120</td>
<td>Штекер на кабель, с защитой от неправильного соединения и прикосновения, крепление под винт, уплотнительная кабельная муфта 19-28мм</td>
</tr>

</tbody>
</table>
<table id="table" width="680">

<thead>
<tr>
<th width="15">№</th>
<th width="230">Наименование</th>
<th width="23">Ток, А</th>
<th width="30">Цвет</th>
<th width="50">Фаза</th>
<th width="332">Описание</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td>POWERLOCK NPS-E-GN-T4</td>
<td>400</td>
<td><img src="images/green.jpg" border="0" width="28"></td>
<td>земля</td>
<td>Розетка на панель, резьбовое отверстие М12 на 400А</td>
</tr>
</tbody>
</table>

Очень прошу вашей помощи! буду очень благодарна!

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

Очень жду ваших советов!

Link to comment
Share on other sites

7 answers to this question

Recommended Posts

  • 0

width="15px" — так нельзя писать. В HTML вы указывается 15 без единиц измерения. Рекомендую сделать так. Задайте первым ячейкам свои классы, для них в стиле укажите необходимую ширину и для всей таблицы table-layout: fixed. Через стили вы сможете удобно управлять шириной всех таблиц и не придётся везде менять 15 на 17, если понадобится.

Ещё замените везде id="table" на нечто вроде class="sortament".

Link to comment
Share on other sites

  • 0
Ещё замените везде id="table" на нечто вроде class="sortament".

а почему7 в чем разница?

width="15px" — так нельзя писать. В HTML вы указывается 15 без единиц измерения.

у меня было сначала написано без px, потмо я дописала, думала поможет)

Link to comment
Share on other sites

  • 0

id это уникальный атрибут, у вас же несколько таблиц, поэтому добавлять его здесь некорректно.

Вы бы не играли ещё в метод Подборского, он не прокатывает в таких случаях.

Link to comment
Share on other sites

  • 0
id это уникальный атрибут, у вас же несколько таблиц, поэтому добавлять его здесь некорректно.

поменяла.

возникла новая проблема. теперь ровновезде, кроме хрома, хром воспринимает значения уже и криво

так выглядит в эксплорере, лисе и опере

1.jpg

а так в хроме (заметно что столбцы уже, напирмер №)

2.jpg

Edited by orgi
Link to comment
Share on other sites

  • 0

Милая девушка, у вас нелады с арифметикой, из-за этого все беды с таблицей. Ведь ещё установлена ширина всей таблицы равная 680 пикселов. А теперь сложите все числа с шириной колонок.

Выхода два: 1) убрать ширину таблицы и задать только ширину колонок; 2) задать ширину таблицы и не указывать ширину последней колонки, она будет "тянуться".

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy