Существует ли CSS-альтернатива горизонтальному расположению таблиц без недостатков?
Мой босс хочет, чтобы я перестал использовать макеты CSS и начал использовать макеты таблиц. Основным фактором в этом является желательное поведение таблиц в горизонтально расположенных, плавных макетах. См. этот пример:
Если вы уменьшите ширину панели HTML, вы увидите, что таблица (первая )имеет несколько удобных качеств:
- Автоматически находит подходящее место для разделения двух ячеек, предоставляя ячейке с большим содержимым больший процент доступной ширины.
- Заполняет всю доступную ширину на 100%.
- При принятии решения о том, какую из ячеек обернуть, он делает это наиболее эффективным способом с точки зрения вертикального пространства.
- Сохраняет две ячейки выровненными по горизонтали, несмотря ни на что.
Пример A не имеет качества 1 . (При изменении размера содержимого соотношение необходимо обновлять вручную.)
Пример B не имеет качества 1 или 3 . (Статические 50 % не идеальны, но могут работать. Однако он разбивается на 3 строки, в то время как высота таблицы по-прежнему составляет всего 2 строки.)
Пример C не имеет качества 2 или 4 . (Я вижу способы подделать качество 2 с помощью этого, но переход на следующую строку полностью нарушает условия сделки.)
Пример D не имеет качества 1 или 4 . (Технически это 1, но огромный разрыв между ними нецелесообразен. Кроме того, плавание влево/вправо в одной строке не работает в некоторых браузерах.)
Поскольку данные не семантически табличны, я действительно хочу избежать использования таблиц. Но мой босс платит мне, поэтому мне нужно согласиться с тем, что он говорит, или найти лучшее решение. Есть ли способ сделать это с помощью семантической разметки и CSS?