Блог

У меня есть строка заголовка, которая имеет такую структуру:

 <th...
  <a...
   <span...
     {text}
  

Если вы посмотрите на вложение, вы заметите, что все заголовки с такой структурой выровнены.

Что ж, при нажатии на определенный заголовок для статуса «отсортирован» структура будет выглядеть:

 <th...
  <a...
   <span...
     <table>
        <tbody>
           <tr>
              <td>
                {text}
              </td>
              <td>
                 <div> //with a background image
              </td>
           </tr>
        </tbody>
     </table>
  

Что ж, в IE8 этот отсортированный столбец больше не выровнен (смотрите скриншот, пожалуйста).

Я много раз пытался добавить некоторый стиль css (position: relative и т.д.) К таблице внутри диапазона, Чтобы исправить выравнивание в IE8, Но у меня не получилось..

Есть ли здесь какой-нибудь гуру css, который может предложить исправление?

Пожалуйста, обратите внимание, что я не могу изменить эту структуру (это некоторый сгенерированный код из библиотеки ICEfaces), но я могу применить атрибуты css (если я знаю, где …).

Кроме того, нет разницы в css (какой-то конкретный важный стиль) для применяемого отсортированного столбца. Просто обычная таблица внутри этого диапазона.

Спасибо.

Возможно, проверьте свойство выравнивания по вертикали. Здесь, судя по скриншоту, он, похоже, находится в режиме по умолчанию, «базовый». (Хотя я не уверен, что это что-то даст)

Попробуйте: th.stuff { vertical-align:top; } или: th.stuff { vertical-align:middle; }

Также вы могли бы сделать все это немного выше и увеличить количество отступов для выравнивания содержимого. Я думаю, что проблема в целом; зависит от выбора, который появляется в th, внутри таблицы.

Вы можете использовать таблицы стилей, специфичные для IE. Они известны как условные таблицы стилей.

http://css-tricks.com/132-how-to-create-an-ie-only-stylesheet/

Идея, конечно, заключалась бы в том, чтобы изменить CSS для этого элемента только для IE (потому что он уже работает с другими браузерами).