Какой правильный путь для кросс-браузерного макета HTML?

Question

Я только что прочитал коды веб-продукта, который должен поддерживать несколько современных браузеров (включая FireFox 3.X, Safari 3.X и IE7 +, но не включая IE6-). HTML-код использует div вместо table для создания табличных эффектов. На самом деле, div организованы так:

   <div>
         <div>
              <div style="float:left" id="header1">...</div>
              <div style="float:left">...</div>
              <div style="float:left">...</div>
         </div>
         <div>
              <div style="float:left" id="header2">...</div>
              <div style="float:left">...</div>
              <div style="float:left">...</div>
         </div>

Существует фрагмент кода JavaScript для загрузки, чтобы прочитать все элементы headerX, вычислить их максимальное значение offsetWidth . Затем присвойте каждому из них максимальное значение offsetWidth . Таким образом, div хорошо выровнен, чтобы быть похожим на таблицу.

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

Я не уверен. Итак, вопрос. Помимо упомянутого выше подхода, есть ли лучший способ сделать макет в виде таблицы для всех популярных браузеров?

Answer 1

HTML-код использует div вместо table для создания табличных эффектов.

Это распространенное заблуждение - старый способ, которым многие люди делали свои макеты, был с таблицами, поэтому они фактически использовали table вместо div для эффектов, похожих на div , :)