Самый простой способ выровнять текст в ячейке таблицы - PullRequest
1 голос
/ 04 октября 2011

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

<div style="text-align: center;">
    <table style="margin: 0px auto;" border="0">
        <table border="0">
            <tbody>
                <tr>
                    <td>ddd</td>
                    <td>ddd</td>
                </tr>
                <tr>
                    <td></td>
                    <td></td>
                </tr>
            </tbody>
        </table>
</div>

Теперь мне нужно выяснить, как центрировать текст в ячейках. Я попытался с помощью align = "center" рядом с тд. Это показало текст по центру в области администратора WordPress, но на реальной веб-странице текст все еще оставался выровненным. Другой парень порекомендовал мне добавить что-то в мой код заголовка и связать это с чем-то. Опять же, я очень мало знаю об этом и был бы признателен за самое простое решение. Спасибо.

Ответы [ 3 ]

2 голосов
/ 04 октября 2011

Добавьте следующий CSS (CSS должен быть добавлен в тегах <style>):

<style>
td {
    vertical-align: middle;
    text-align: center;
}
</style>

Также .. удалите один из тегов <table>:

<table style="margin:0px auto;" border="0">
<table border="0">

должно быть

<table style="margin:0px auto;" border="0">
1 голос
/ 04 октября 2011
<td style="text-align:center"></td>

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

вам не нужен div выше или стиль в табличном теге, и только один табличный тег:)

<table>
 <tr>
    <td style="text-align:center">centered text</td>
 </tr>
</table>
0 голосов
/ 04 октября 2011

Вот два простых способа:

<td align="left">foo</td>
<td style="text-align:left;">foo</td>

РЕДАКТИРОВАТЬ

Как уже упоминалось, вам также необходимо удалить вложенные теги <table>.

...