Могу ли я смешать процентную ширину и ширину пикселя в моих заголовках таблицы HTML? - PullRequest
11 голосов
/ 18 января 2012

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

Таблица должна быть не шире, чем 800px, и я хотел бы, чтобы кнопка отправки была смещена вправо.Есть ли способ установить ширину столбцов таблицы, которые изменяются в процентах, и один статический столбец в качестве фиксированной ширины пикселя?Или это вызовет проблемы?Я пробовал несколько разных подходов, но все они кажутся неоптимальными.Есть ли элегантный способ сделать это?Я приложил картинку для справки: http://bayimg.com/BAlLLaaDP.

HTML:

<html>
    <head>
    <style>
        #container {
         width: 800px;
       }
       #table_container {
         padding:5px;
       }
       #table_container table {
         width: 85%;
       }
       .action {
       }
       col {
       width:29%;
       }
       table {
       width:650px;
       table-layout: fixed;
       float: left;
       }
     </style>
     </head>

<body>
<div id="container" class="clearfix">

    <form>
            <table class="" border=1>
                <colgroup>
                    <col >
                    <col>
                    <col>
                    <col class="action">
                </colgroup>
                <th>First Name</th>
                <th>Last Name</th>
                <th>Email </th>
                <th></th>
                <tr>
                    <td>content 1</td>
                    <td>content 2</td>
                    <td>content 3 </td>
                    <td><a href="">delete row</a>
                </tr>   
                <tr>
                    <td>content 1</td>
                    <td>content 2</td>
                    <td>content 3 </td>
                    <td><a href="">delete row</a>
                </tr>
            </table>
        <div class="mult_answer">
            <button class="button orange">Submit Answer</button>
        </div>
        </form>

</div>

</body>
</html>

1 Ответ

5 голосов
/ 18 января 2012

В одной таблице могут быть строки с шириной в пикселях и процентом, если общая ширина всех строк не превышает 100% (если больше строк или таблицы будет масштабироваться для соответствия содержимому).
Вы можете добавить ширинудо th элементов, если вы используете col только для ширины.Лучше оставить хотя бы один столбец без ширины, чтобы он мог уместиться.
PS Я не понимаю, зачем вам width: 100%; для td элемента.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...