|
>Форум Mozilla Россия http://forum.mozilla-russia.org/index.php >Разработка http://forum.mozilla-russia.org/viewforum.php?id=18 >Ширина ячеек в процентах при table.style.display = block http://forum.mozilla-russia.org/viewtopic.php?id=75110 |
| mikado3333 > 03-12-2019 16:08:54 |
Приветствую! Не могу понять как считает браузер ширину колонок в процентах, если у таблицы в стилях display = block, width 100%? Выделить код Код:<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="-1" />
<title>РАЗРАБОТКА</title>
<style>
html
{height:100%;}
body
{background: RGB(64,73,82); color:#000; height:100%; padding:0.5%; margin:0px; overflow:hidden;}
.table_style1
{border:solid 2px #807C6E; border-collapse:collapse; display:block; float: left; height:100%; width:100%; overflow:auto; position:relative; z-index:1;}
.table_style1 thead
{overflow:hidden;position: sticky; top:0; z-index:2; width:100%;}
.table_style1 thead th
{background:#4f4f4f; border-top-width:0; color:white; cursor:pointer; font-size:90%; font-weight:normal;padding:3px; min-width:30px; text-align:center;white-space:nowrap;user-select:none; -moz-user-select:none; }
.table_style1 td
{border:solid 1px #807C6E; font-size:80%; padding:3px; user-select:none; -moz-user-select:none; min-width:30px; max-width:25vw; white-space:pre-line;}
.table_style1 td:hover, .table_style1 thead th:hover
{user-select:text; -moz-user-select:text;}
.table_style1 tbody
{background:#D2B48C; width:100%;}
.table_style1 td:nth-child(1)
{border-left-width:0;}
.table_style1 td:nth-last-child(1)
{border-right-width:0;}
.table_style1 tbody tr[data-mark="1"] td
{background-color:#AFCCB8;}
.table_style1 tr[data-del="1"] td
{text-decoration:line-through;}
.table_style1 th:nth-of-type(1),.table_style1 th:nth-of-type(3)
{width:1%}
.table_style1 th:nth-of-type(2),.table_style1 th:nth-of-type(4)
{width:2%}
</style>
</head>
<body>
<table class="table_style1">
<thead>
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
</tr>
</thead>
<tbody>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr> <tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr> <tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr> <tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr> <tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr> <tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr> <tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr> <tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr> <tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr> <tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
<tr>
<td>test test </td>
<td>test test </td>
<td>test test </td>
<td>test test </td>
</tr>
<tr>
<td>тест</td>
<td>тест</td>
<td>тест</td>
<td>тест</td>
</tr>
</tbody>
</table>
</body>
</html> |