html - div中的居中元素

Question

我必须将 div.to_left_60 中的所有元素居中。我需要适用于其中所有元素的解决方案。 为此，我设置了 text-align: center。它适用于文本，但不适用于我的 ul 元素。我试过使用边距和absolute/relative，但没有成功。

ul.problem 是我必须在这个 div 中居中的元素。从 jsfiddle 中，您可以看到白色背景没有居中。

HTML

<div class="to_left_40">gtestsetes</div>
<div class="to_left_60">
    <p>gtestsetes</p>
    <img src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcTvZsT7cLwPFCC0joFhZoi6OylhGaIVHBPYn--PrH3nzZdMwH0grA" width="265px" />
    <ul class="problem">
        <li>fsfsd</li>
        <li>fsfsd</li>
    </ul>
    <ul>
        <li>fsfsd</li>
        <li>fsfsd</li>
    </ul>

CSS

ul {
    list-style: none;
    text-align: justify;
    background-color: yellow;
}
ul.problem li {
    list-style-type: none;
    display: block;
    width: 245px;
    height: 164px;
    padding: 14px 10px 0 10px;
    background-color: white;
    background-repeat: no-repeat;
    text-align: center;
    font-size: 18px;
}
.to_left_40 {
    float: left;
    width: 40%;
    background-color: red;
}
.to_left_60 {
    float: left;
    width: 60%;
    background-color: green;
    text-align: center;
}

JSFiddle:http://jsfiddle.net/qVTQ4/

编辑:(解决方案)

这有助于:

ul.problem li{margin:0 auto;}

我修改了这个解决方案:

.to_left_60 * {
    margin:0 auto;
}

Answer 1

试试这个方法

ul.problem li{margin:0 auto;}

Demo