Я все еще новичок и буду признателен за любую помощь, которую вы можете оказать.
Я пытаюсь не допустить превышения таблицей HTML длины страницы. В настоящее время я анализирую csv с PHP и зацикливаю информацию массива в таблицу HTML.
Таблица должна отображаться на статическом экране 1080p, поэтому размер самой таблицы нужно изменять, уменьшая ячейки, а не уходя со страницы по горизонтали или вертикали. Я не против того, насколько раздавленными становятся клетки, поскольку они имеют цветовую кодировку CSS.
У меня слишком много строк кода, чтобы публиковать их здесь, поэтому я просто опубликую свой код в стиле CSS, который я попытался использовать для размещения своей таблицы.
<style>
html,body {
background-color: #F4F4F4
margin: 0;
padding: 0;
height: 100%;
border: 0;
}
table{
height:100%;
width:100%;
overflow: hidden;
white-space: nowrap;
}
td {
border: 1px solid black;
resize: both;
overflow: hidden;
}
th {
resize: both;
overflow: auto;
}
</style>
Я пробовал разные варианты выше, но безрезультатно, например. Переполнение настроек, изменение размера настроек и т. д. Это только мой текущий тест.
Мне все равно, должен ли я использовать HTML, CSS, Javascript, JQuery или PHP для этого. Я бы предпочел не начинать все сначала.
Попробуйте включить это в свои теги:
td.wordbreak {
word-break: break-all;
width: NNNpx;
}
Это должно решить проблему с ячейками, выплевывающими ваш стол горизонтально.
Замените NNN числом в пикселях, которое может составлять часть от общего количества, которое вам нужно.
Допустим, у вас было только 2 столбца, это было бы:
table {
table-layout: fixed; width: 100%;
}
td
{
word-break: break-all;
width: 540px;
}
попробуй использовать
table {
table-layout: fixed;
width: 100%;
}
Для дополнительной проверки Фиксированные макеты таблиц.
Надеюсь, это поможет.