1

我必须将所有元素居中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;
}
4

6 回答 6

7

试试这个方法

ul.problem li{margin:0 auto;}

演示

于 2013-07-19T10:35:25.127 回答
1

看看这个 - http://jsfiddle.net/2y7R8/

我所做的只是在 ul 上设置一个宽度并添加margin: 0 auto到中心。

于 2013-07-19T10:36:01.797 回答
0

尝试框对齐

div
{
width:350px;
height:100px;
border:1px solid black;

/* Internet Explorer 10 */

 display:-ms-flexbox;
-ms-flex-pack:center;
-ms-flex-align:center;

/* 火狐 */

display:-moz-box;
-moz-box-pack:center;
-moz-box-align:center;

/* Safari、Opera 和 Chrome */

display:-webkit-box;
-webkit-box-pack:center;
-webkit-box-align:center;

/* W3C */

display:box;
box-pack:center;
box-align:center;
}
于 2013-07-19T10:39:16.570 回答
0

尝试删除

ul
{
  text-align: justify;
}

IE

ul {
    list-style: none;
    background-color: yellow;
}
于 2013-07-19T10:40:11.923 回答
0

试试这个 

ul.problem li {
margin:0 auto;
}

这可以将ui块设置在中心。它使两边的边距相等。

于 2013-07-19T10:41:14.287 回答
0

您可以声明ul { padding:0; }看起来您的 li 居中，但父 ul 具有默认填充。

于 2013-07-19T10:45:51.663 回答