Выравнивание таблиц по левому краю с помощью CSS

Question

Я хотел бы выровнять таблицу по левому краю с помощью CSS, аналогично выравниванию = слева в стандартном HTML, но я понимаю, что это плохая форма. Есть какой-либо способ сделать это? Если нет, есть ли способ отформатировать выровненный по левому краю список ссылок, следующий за контентом, без использования таблиц?

Answer 1

Для простоты возьмите материал из тегов стиля и используйте вместо этого классы CSS:

<ul style="text-align: left; float: left;">
    <li><a href="#">Your link here!</a></li>
</ul>

Simple. При отображении списка вам нужно присвоить содержащему элемент <ul> стиль overflow: auto;, чтобы удалить плавающий элемент для следующего элемента, который появляется под ним.

Исходя из сказанного jeroen, да, по умолчанию таблица должна быть выровнена по левому краю, если вы не установили dir="rtl" где-то в вашей DOM. И в этом случае, если вы не занимаетесь творчеством или пишете на иврите, нет причин для этого;)

Answer 2

Ответ на вопрос «Как выровнять текст внутри таблицы?», А не о div или как их плавать.

Вот как сделать, чтобы таблица отображалась в левой части страницы без использования устаревшего атрибута выравнивания:

<table style="margin-right:auto;margin-left:0px">

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

Answer 3

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

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

Answer 4

использование margin:auto 0
это как чудо

Answer 5

Как прокомментировал Джейсон, по умолчанию все выровнено по левому краю в HTML. Если содержимое вашей таблицы не выровнено по левому краю, вы должны либо каким-то образом изменить их выравнивание, либо вы видите побочный эффект какого-либо заполнения или чего-то еще. Чтобы «исправить» такую ​​таблицу, попробуйте CSS в следующем виде:

<style>
TABLE, TBODY, TR, TD, TH {
  text-align:left;
  padding:0;
  border-spacing:0; /* or border-collapse:collapse */
}
</style>