Динамически создаваемый элемент, сохраняя только 2 деления на строку

Question

Динамически создаваемый элемент, сохраняя только 2 деления на строку

0

В моем коде Dynamically div создаются, я хочу сохранить только 2 div в одной строке. иногда я получаю 6 или 7. как я могу сделать только 2 div я одной строки?

Мне нужно сделать 2 div inline, а затем добавить новую строку, а затем 2 div inline и новую строку.

colorList += "<div>";
$.each(array, function( index, value ) {
    colorList += "<div id='" + value + "' class='Productcolours' style='background-color:" + value + "; display: inline-block;'>" + value + "</div>";
});
colorList += "</div>";

anam 11 нояб. 2013, в 13:53

Источник

2

Пожалуйста, объясните, что означает "как я могу сделать только 2 деления в одной строке"
Rituraj ratan 11 нояб. 2013, в 12:13
0

Вы имеете в виду, что у вас будет только два внутренних inline-block с отображением inline-block , верно?
palaѕн 11 нояб. 2013, в 12:14
0

вы используете функцию $ .each (), поэтому вы создадите столько элементов div в качестве элементов массива
Ricky Stam 11 нояб. 2013, в 12:14
0

попробуйте установить внутренний div css width: 50% и float: left; и установите ширину основного div как 100% или 1000px и т. д.
Asif 11 нояб. 2013, в 12:16
0

@ palaѕн я хочу сделать 2 div встроенными, а затем новую строку.
anam 11 нояб. 2013, в 12:54

Показать ещё 3 комментария

Теги:

javascript

jquery

html

css

3 ответа

Ещё вопросы

Пожалуйста, объясните, что означает "как я могу сделать только 2 деления в одной строке"
Вы имеете в виду, что у вас будет только два внутренних inline-block с отображением inline-block , верно?
вы используете функцию $ .each (), поэтому вы создадите столько элементов div в качестве элементов массива
попробуйте установить внутренний div css width: 50% и float: left; и установите ширину основного div как 100% или 1000px и т. д.
@ palaѕн я хочу сделать 2 div встроенными, а затем новую строку.

Gowsikan · Answer 1 · 2013-11-11T09-54-00.000Z

Это можно сделать тремя способами

Уменьшите ширину родительского элемента до ширины двух элементов.Productcolours
установить ширину.Productcolours до 50%
добавить <br> тег путем проверки индекса в $.each
```
if((index+1)%2==0 && index > 0)
{
   colorList += "<br>"
}
```

Haywire · Answer 2 · 2013-11-11T11-26-00.000Z

Вместо того, чтобы использовать <br/>, я бы предложил вставить '', который может очистить место для вас.

Это также поможет, если вы хотите сделать больше, а не одиночные разрывы строк между строками. Таким образом, он дает более контролируемый дизайн:

colorList += "<div>";
$.each(array, function( index, value ) {
    colorList += "<div id='" + value + "' class='Productcolours' style='background-color:" + value + "; display: inline-block;'>" + value + "</div>";

    if( (index+1) %2 == 0) {
        colorList += "<div class='clearLine'></div>";
    }
});
colorList += "</div>";

и в CSS вы можете добавить:

.clearLine {
    margin: 5px 0;
    /* or whatever you like to mark a clean space
        or additional decorations
    */
}

Ankit Tyagi · Answer 3 · 2013-11-11T11-07-00.000Z

colorList += "<div>";
$.each(array, function( index, value ) {
    colorList += "<div id='" + value + "' class='Productcolours' style='background-color:" + value + "; display: inline-block;'>" + value + "</div>";

if( (index+1) % 2 == 0 ){
    colorList += '<br />' 
}

});
colorList += "</div>";