дисплей: строка таблицы не работает - PullRequest
Новая
       4

дисплей: строка таблицы не работает

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

У меня есть клиентская форма, которая включает HTML, обслуживаемый из iframe - я не могу редактировать ее. Единственное, что я могу сделать, это применить CSS-правки.

Я пытаюсь применить простую настройку, которая бы складывала <td> s в форму, чтобы 

1. What is your age?

становится 

1.
What is your age?

Если щелкнуть правой кнопкой мыши первый вопрос и Inspect Element, вы увидите довольно интересную структуру DOM, с которой я могу работать. Этот пример выглядит так: 

<div id="Age" class="questionlabel">
    <table border="0" cellpadding="0" cellspacing="0">   
        <tbody>
            <tr>
                <td>
                    <span class="questionnumber_questionlabel">1. </span>
                </td>
                <td>
                    <label class="required">What is your age?</label>
                </td>
            </tr>
        </tbody>
    </table>
</div>

Когда я проверяю это <td> и добавляю display:table-row;, это полностью игнорирует меня. Это в Chrome - я могу скопировать этот DOM и заставить CSS делать то, что я хочу в jsfiddle , поэтому я думаю, что есть сброс, который я не вижу. Я даже пытался display:table-row !important; безрезультатно. Я могу применить border:2px solid blue; без проблем. Я могу подать display:none; без проблем.

Есть какие-нибудь идеи относительно того, что здесь происходит, что помешало бы этому простому параметру CSS работать?

Чтобы повторить, ЕДИНСТВЕННОЕ, что я могу сделать, это применить CSS - без JavaScript и без редактирования HTML. В основном я передаю CSS-файл в URL к iFrame. Это все, что я получаю. Спасибо!

РЕДАКТИРОВАТЬ: Я извиняюсь, что мне пришлось удалить ссылку на пример формы на живом сайте.

1 Ответ

3 голосов
/ 02 августа 2011

Редактировать - скриншоты пришлось удалить, но решение все еще действует.

Добавлен этот код в form-css.css , используя Firebug.Начало или конец, это не имело значения: 

table#form_table div.questionlabel td {display: table-row !important;}
.questionnumber_questionlabel {margin: inherit!important;}

(Примечание: я сбросил это поле, так как старое (-10px) вызывало неприглядное наложение.)

...