Как я могу масштабировать div до 100% высоты и ширины внутри другого элемента - PullRequest
Новая
       13

Как я могу масштабировать div до 100% высоты и ширины внутри другого элемента

5 голосов
/ 21 февраля 2009

Как я могу масштабировать div до 100% высоты и ширины внутри другого элемента? В моем случае это окружающий тд. Поскольку я плагин, я не могу контролировать другой HTML-код на странице. Вот мой HTML: 

<body style="height:100%;">
  <table width="600px" height="400px" border="1">
    <tr>
      <td style="background-color:silver;">Cell 1</td>

      <td style="background-color:silver;">
    <div style="height:100%; background-color:yellow;">
      <div style="min-height:100%; height:100%; background-color:red;">
        Cell 2
      </div>
    </div>
      </td>
    </tr>
  </table>
</body>

Итак, деление Cell 2 должно быть максимально увеличено. Есть ли кросс-браузерный способ сделать это? Почему это так сложно?

Ответы [ 3 ]

5 голосов
/ 21 февраля 2009

Посмотрите на этот вопрос переполнения стека , а также ... после просмотра ответа с самым высоким рейтингом в этом вопросе, похоже, что вы должны установить высоту контейнера равной 100 % и "min-height, height" дочернего элемента до 100%.

Перейдите на этот сайт для получения дополнительной информации - приведенный ниже HTML-код является урезанной версией сайта 

<div style="height:100%;">
  <div style="min-height:100%; height:100%; background-color:red;">  
    put your content here 
  </div> 
</div>
2 голосов
/ 21 февраля 2009

Используя javascript / jquery, вы можете легко получить высоту родительского элемента и соответственно изменить размер вашего div.

Однако, поскольку div находится в ячейке таблицы, ширина не фиксируется, поскольку ячейка будет расширяться и сжиматься в соответствии с содержимым других ячеек таблицы. Таким образом, правильной ширины на самом деле нет, ячейка адаптируется в соответствии с содержимым всех ячеек.

Кстати, проблему с высотой легко решить, установив ее в 400px, но я предполагаю, что показанная структура таблицы - только пример (1 строка, высота 400px ...).

1 голос
/ 21 февраля 2009

Зачем обоим иметь div внутри div, если он будет равен 100% высоты и ширины? Нет ли другого способа просто использовать содержащийся div для вашей цели?

Вероятно, он не работает, потому что высота падает, если к контактному элементу не применена определенная высота.

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

Нет похожих вопросов

...