Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 17.03.2016, 15:48
Аспирант
Отправить личное сообщение для shurik_shink Посмотреть профиль Найти все сообщения от shurik_shink
 
Регистрация: 22.05.2015
Сообщений: 35

Почему не работает text-align: center?
В данном примере не работает стиль text-align: center для таблицы - таблица выравнивается по левому краю div.
Текст выравнивается как положено по центру.
Подскажите кто знает - по чему так происходит и как выровнять таблицу по центру?

<style>
div{text-align: center; width: 100%; border: 1px solid red;}
table{border: 1px solid green;}
td{background-color: yellow; width: 50px;}
</style>
<div>
тестовый текст
<table>
<tr><td>1</td><td>2</td><td>3</td><td>4</td></tr>
<tr><td>5</td><td>6</td><td>7</td><td>8</td></tr>
<tr><td>9</td><td>10</td><td>11</td><td>12</td></tr>
</table>
</div>

Последний раз редактировалось shurik_shink, 17.03.2016 в 16:07.
Ответить с цитированием
  #2 (permalink)  
Старый 17.03.2016, 20:06
Аватар для Coriolan161
Профессор
Отправить личное сообщение для Coriolan161 Посмотреть профиль Найти все сообщения от Coriolan161
 
Регистрация: 21.11.2015
Сообщений: 440

shurik_shink,
table{border: 1px solid green; margin:0 auto;}
Ответить с цитированием
  #3 (permalink)  
Старый 17.03.2016, 20:10
Аватар для Coriolan161
Профессор
Отправить личное сообщение для Coriolan161 Посмотреть профиль Найти все сообщения от Coriolan161
 
Регистрация: 21.11.2015
Сообщений: 440

shurik_shink,
Зачем ты задаешь диву такую ширину?
width: 100%;

Он блочный и по умолчанию растягивается на всю ширину
Так что, если ты не планируешь переопределять его display, это лишнее
Ответить с цитированием
  #4 (permalink)  
Старый 17.03.2016, 20:14
Аватар для Coriolan161
Профессор
Отправить личное сообщение для Coriolan161 Посмотреть профиль Найти все сообщения от Coriolan161
 
Регистрация: 21.11.2015
Сообщений: 440

shurik_shink,
text-align: center
не работает из-за того, что у div свойство
display: block;

А у таблицы (по стандарту и умолчанию):
display: table;

Там короче конфликт происходит.
Ответить с цитированием
  #5 (permalink)  
Старый 18.03.2016, 12:50
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 3,018

shurik_shink, для таблицы:

display: inline-table;
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Почему не работает подключенный скрипт?? ivt22 Элементы интерфейса 1 04.01.2016 10:59
Плагин для Chrome. Анти - мат. Проблема с обновлением. Pacman Javascript под браузер 3 31.05.2013 21:40
Плагин для Chrome. Анти - мат. Проблема с обновлением. timedo Общие вопросы Javascript 1 30.05.2013 12:28
Не пойму почему не работает код? Mukhtar Events/DOM/Window 4 29.04.2013 00:01
как создать елемент с вложеными елементами scuter Events/DOM/Window 11 14.05.2008 16:15