У меня есть HTML-код с панелью навигации вверху, div с несколькими ячейками, а затем еще один div, который является div "главной страницы".
Таким образом, у главной страницы div есть таблица с несколькими столбцами. Эта таблица является формой и почти все являются входными данными. Я попытался добавить еще один столбец, и страница дает мне переполнение вправо.
Я хочу предотвратить это и сделать таблицу способной уменьшаться в зависимости от экрана. У меня эта проблема на 15 "экране. Хотя на 32-дюймовом экране проблем нет, и все в порядке.
Мой код CSS для таблицы и HTML-кода и, как я вижу, входные данные в таблице должны иметь возможность сжиматься на основе значений по умолчанию, которые они получают:
html, body {
height: 100%;
margin: 0;
}
#mileCtlTable{
position: relative;
vertical-align: middle;
text-align: center;
border-collapse: collapse;
margin:auto;
border: 3px solid black;
//white-space: nowrap;
width: 100%;
}
#mileCtlTable thead td{
border: 1px solid black;
font-style:oblique;
text-align:center;
//white-space: nowrap;
margin:0vw;
background-color: navy;
color:white;
}
#mileCtlTable tbody td{
border: 1px solid black;
//width:auto;
white-space: nowrap;
text-align: center;
}
#mileCtlTable td,#mileCtlTable th{
padding: 0.2vw 0.5vw;
}
#mileCtlTable input{
text-align: center;
//white-space: nowrap;
padding: 0.2vw 0.5vw;
}