Выравнивание по центру ячейки таблицы в двух разных ячейках

-1

В приведенном ниже HTML-коде. Вы можете найти код на "Center align"Выравнивание по центру ячейки таблицы в двух разных ячейках

CSS

.QuestionnaireGroupQuestionContainer table td { 
     border: 1px solid red; 
    } 

    .tabularOptionsHeader input { 
     visibility: hidden; 
    } 

    .tabularOptions label { 
     visibility: hidden; 
    } 

    .tabularOptions { 
     border-spacing: 0px; 
     vertical-align: top; 
    }

HTML

<body class="QuestionnaireGroupQuestionContainer"> 
<table class="tabularOptionsHeader"> 
    <tbody> 
     <tr> 
      <td> 
       <span class="QuestionOptions"> 
        <input type="radio" /> 
        <label>1. (Slet ikke relevant)</label> 
       </span> 
      </td> 
     </tr> 
    </tbody> 
</table> 
<table class="tabularOptions"> 
    <tbody> 
     <tr> 
      <td> 
       <span class="QuestionOptions"> 
        <input type="radio" /> 
        <label> 
         1. (Slet ikke relevant) 
        </label> 
       </span> 
      </td> 
     </tr> 
    </tbody> 
</table>

У меня есть две таблицы, в основном, с классом tabularOptionsHeader и tabularOptions

Первый класс таблица содержит строку с пролетом, содержащим переключатель и метку для него
Второго класса таблицы содержит еще одну строки с помощью кнопки радио и этикеток оба они идентичный.

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

Я могу для того чтобы достигнуть этого с помощью CSS и установив первый входной таблицы типа радио видимость: скрытый и второй стол я установить видимость метки, чтобы скрыть.

Ниже представлен выход.

enter image description here

Мне нужно, чтобы выровнять этот текст заголовка и переключатель к центру своих клеток, но им не в состоянии сделать это, главным образом, из-за установки на видимости атрибута CSS, что у меня есть установлен в .

Я не могу использовать показа: Нет потому что мне нужно, чтобы иметь точную ширину столбца, который содержит текст, а также столбец, который содержит переключатель в двух различных таблицах.

Возможно ли использование CSS, чтобы я мог достичь выравнивания по центру текста и переключателя в двух разных таблицах?

Добавление строки во вторую таблицу к первой таблице невозможно, так как вывод состоит из двух отдельных таблиц.

источник

2015-03-27 user581157

Почему у вас есть две отдельные таблицы, а не только одна таблица? –

Это упрощенная версия HTML. Фактический html - это веб-элемент управления asp.net, где каждая таблица здесь является таблицей RadioButtonList.Hence. – user581157

Можете ли вы разместить свой веб-код управления ASP.Net, пожалуйста? –

Try так:

table.t td { 
 
    text-align: center; 
 
} 
 
table.t td input { 
 
    position: relative; 
 
    display:none; 
 
} 
 
table.tt td { 
 
    text-align: center; 
 
} 
 
table.tt td input { 
 
    position: relative; 
 
} 
 
table.tt td label { 
 
    display:none; 
 
}

<table class="t" border="1"> 
 
    <tbody> 
 
    <tr> 
 
     <td width="200"> 
 
     <input type="radio" /> 
 
     <label>1. (Slet ikke relevant)</label> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     <input type="radio" /> 
 
     <label>1. (Slet ikke relevant)</label> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 
<table class="tt" border="1"> 
 
    <tbody> 
 
    <tr> 
 
     <td width="200"> 
 
     <input type="radio" /> 
 
     <label>1. (Slet ikke relevant)</label> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     <input type="radio" /> 
 
     <label>1. (Slet ikke relevant)</label> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table>

источник

2015-03-27 12:04:31

Можно ли удалить ширину = «200px» и использовать ширину, занимаемую текстом «1. (Slet ikke related)»? – user581157

Если вы хотите, чтобы добиться того, что я предлагаю вам необходимо изменить свой DOM:

table th, table td { 
 
    text-align:center; 
 
}

<table> 
 
    <tbody> 
 
     <tr> 
 
      <th>1. (Slet ikke relevant)</th>     
 
     </tr> 
 
     <tr> 
 
      <td><input type="radio" /></td>     
 
     </tr> 
 
    </tbody> 
 
</table>

Если это невозможно сделать в вашем заднем конце, то я хотел бы предложить JavaScript.

источник

2015-03-27 10:52:21

Невозможно ли какое-то позиционирование css для входного элемента, чтобы он выравнивался по центру центра td. По существу, накладывается на ярлык, видимость которого скрыта? – user581157

Выравнивание по центру ячейки таблицы в двух разных ячейках

ответ

Смежные вопросы