CSS: лучший способ выровнять поплавок по левому краю: правая часть

Question

Я хочу, чтобы в старые добрые времена была таблица с двумя столбцами. Это для http://paulisageek.com/resume и отлично работает с:

.dates {
  float:right;
  width:171px;
}

но я уверен, что я нарушу размеры обновлений (и разные шрифты, и браузеры, и размеры шрифтов и т. Д.).

Есть ли способ сделать второй столбец автоматически изменяемого размера без принудительной ширины (или с использованием javascript)? Будет ли у CSS3 способ?

Answer 1

Дайте вашему столбцу дат минимальную ширину и максимальную ширину вместо фиксированной ширины. Это дает вам гибкость, но гарантирует, что ваш дизайн не сломается:

.dates {
  float:right;
  min-width:171px;
  max-width:300px;
}

Обратите внимание, что min-width и max-width не включают отступы, границы или поля.

Другая возможность состоит в том, чтобы выровнять даты по правому краю и вывести их на экран:

.dates p{
  text-align:right;
  display:inline;
}

Таким образом, вам не понадобится отдельный div для дат.

... Или, если вы хотите быть суперсовременным и гарантировать, что ваш макет ломается в IE, вы можете использовать новые столбцы CSS3 (здесь не рекомендуется, но все же стоит прочитать)

Answer 2

То, что у вас есть, это то, что необычайно хорошо и легко работает с таблицами. Мало того, что он невероятно обратно совместим. В «чистом» CSS это сложно. Вы можете сделать один из столбцов переменной шириной, но не оба. Если вам это действительно нужно, придерживайтесь таблиц (независимо от того, что могут сказать фанаты семантического HTML).

Answer 3

Да, это возможно. Ключевое слово для поиска - ликвидные столбцы. Например, это имеет дело с целыми макетами, но точки совпадают.