Проблема с выравниванием div вправо в табличном макете - PullRequest
Новая
       45

Проблема с выравниванием div вправо в табличном макете

1 голос
/ 17 августа 2011

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

Учитывая (упрощенный) код, приведенный ниже, возможно ли отобразить ABC в крайнем правом углу в IE6 и IE7? 

<table>
  <tr>
    <td style="width:200px; border:solid 1px black;">
      <!-- can only make changes inside here -->
      <div style="border:solid 1px red; text-align:right;">ABC</div>
      <input style="width:300px;" value="DEF">
    </td>
  </tr>
</table>

Тег <input> представляет некоторый контент, который может быть длиннее, чем заданная ширина ячейки таблицы. В IE8 или других современных браузерах div может расширяться в соответствии с вводом. Но в IE6 и IE7 я не могу заставить его расширяться за пределы 200px, используя только CSS. Я попытался использовать float, width, position position и т. Д. Еще раз, я не могу удалить объявление ширины 200px или внести другие изменения в структуру таблицы.

Кто-нибудь знает, как это сделать? Спасибо.

1 Ответ

0 голосов
/ 17 августа 2011

Если вы можете изменить структуру внутри ячейки, вы можете обернуть все в div, который имеет float:left (или right, или inline-block), поэтому он будет расширен до содержимого, подобного этому: http://jsfiddle.net/kizu/AkVqS/

Если вы не можете обернуть часть input, вы можете использовать выражение, которое выполняется только один раз (чтобы это не вызывало проблем с производительностью): http://jsfiddle.net/AkVqS/2/

...