Как сделать мой div в CSS?

Question

Это мой настоящий div: Pic1

Это HTML-код Pic1, он будет зацикливаться на основе базы данных:

<ul class="productUl">
    <li class="productLi">
        <div class="productItem">
                   <!--my div content-->
        </div>
    </li>
</ul>

Это мой код CSS:

.productItem{
    width: 15em;
    height: 13.8em;
    text-align:center;
    background-color: red;

}
.productUl{
    width: 750px;
    text-align:center;
    list-style-type:none;
    padding:5px;
    margin: 0;
} 

.productLi{
    width: 15em;
    float: left; 
    padding:0px 5px; 
}

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

Это то, что я хочу: pic2

Answer 1

у меня работает .

Ваша проблема, видимо, в другом месте.

Можете ли вы показать нам полную страницу?

Answer 2

Я бы рекомендовал не использовать li, но установить display в inline или inline-block. Вам также может понадобиться установить white-space: nowrap на ul.

Надеюсь, это поможет, harpax

Answer 3

Я считаю, что это будет работать:

.productLi {display: inline; /* or inline-block */ }