2012-04-02 3 views
0

Еще один веб-парень пытается узнать плавающие макеты после использования HTML-таблиц в течение многих лет ...плавающих макеты перетекает

Я динамически создавать плавающие дивы с помощью вызова JQuery.

Каждый div ограничен шириной, высотой, минимальной шириной, минимальной высотой, максимальной шириной и максимальной высотой. По большей части они выравниваются ОК, но иногда один из divs будет слишком коротким или слишком длинным.

Если я опечатаю страницу (всплывающее окно ctrl + shft + j в chrome или измените размер окна), оскорбительный раздел застегивается на место.

Это недостаток? Я танцую на разбитом стакане неопределенного поведения?

function createChartsHTML(size) { 
    var htmlString = ""; 
    for(var i = 0; i < size; i++) { 
      htmlString += '<div id="unit'; 
      htmlString += i; 
      if (i % 2 == 0) 
       htmlString += '" style="width: 45%; min-width: 45%; max-width: 45%; height: 300px; margin: 0 100; float: left">';   // hammer this one into size! 
      else 
       htmlString += '" style="width: 45%; min-width: 45%; max-width: 45%; height: 300px; margin: 0 100; float: right">';  // bam ! 
      htmlString += '</div>'; 
      if ((i+1) % 2 == 0) 
       htmlString += '<br style="clear:both">'; 
    } 
    $('#charts_area').html(htmlString); 
} 
+0

Это неправильный способ добавления элементов в DOM. См. [This] (http://www.elated.com/articles/jquery-adding-elements/) для поиска document.createElement(). Обратите внимание, что вы можете поместить стили в файл CSS или между