2 qq 26946497 qq_26946497 于 2016.02.14 10:39 提问

css/padding属性如何禁用

问题描述:
为了使ul-li居中对齐,采用text-align:center + display:inline方法
然而网上简单好用的方法拿到实际工作中就各种失效。最后检查问题发现了原因
这是正确的情况:
图片说明
这是错误的情况:
图片说明
竟然只需要将padding:0这个属性禁用掉就好了!
1.不理解为什么,padding:0应该是一个人畜无害的属性才对啊
2.怎么办,既不可能去修改公用的css样式,也不可能不引入这个css文件
css不存在"解除一个属性定义",只能"复写这个属性定义"
那么应该将padding属性设置成什么呢?
》》》附部分有效代码:

<style type="text/css">
    #wizard ul {
        list-style: outside none none;
        text-align:center;
        padding:0;/*万恶之源*/
    }
    #wizard ul li {
        color:#FFF;
        display:inline;
        float:left;
        width:14%;
        border-radius:5px;
        background-color:#000;
    }
    #wizard ul li div.index {
        float:left;
        width:24%;
        font-weight:bold;
    }
    #wizard ul li div.name {
        float:left;
        width:75%;
        text-align: left;
    }
</style>
</head>
<body>
    <div id="wizard" class="swMain">                    
        <ul id="0" class="" style="margin: 0px;">
            <li id="prog0" isdone="1" class="selected"><div class="index">1</div><div class="name">&nbsp;标签名称</div>
            </li>
            <li id="prog1"><div class="index">2</div><div class="name">&nbsp;标签名称</div>
            </li>
            <li id="prog2"><div class="index">3</div><div class="name">&nbsp;标签名称</div>
            </li>
            <li id="prog3"><div class="index">4</div><div class="name">&nbsp;标签名称</div>
            </li>
            <li id="prog4"><div class="index">5</div><div class="name">&nbsp;标签名称</div>
            </li>
            <li id="prog5"><div class="index">6</div><div class="name">&nbsp;标签名称</div>
            </li>
            <li id="prog6"><div class="index">7</div><div class="name">&nbsp;标签名称</div>
            </li> 
        </ul>                   
    </div>

求解决方案

3个回答

qq_19891827
qq_19891827   2016.02.16 14:58
已采纳

浏览器默认自带8px左右padding,,但该值在不同浏览器会有一定差别,可以重置为8px试试。如果你用了其他css类的框架该值视具体框架而定。

showbo
showbo   Ds   Rxr 2016.02.14 11:05

ul,li,form这种有些浏览器有默认的padding,margin值,所以你要统一显示,必须设置padding:0;margin:0去掉浏览器默认的空白边才行

showbo
showbo 回复谁用了我的英文名: 这个和padding没关系啊,你去掉padding后使用默认的系统空白变,左边肯定会出现空白。设置也居中啊,只是左边留白和你右边有点差距而已,应为你是按照比例14%来设置li,右边的空白和左边空白肯定不会100%一样的,你的li应该是100/7=14.28.
接近 2 年之前 回复
qq_26946497
qq_26946497 但是设置padding之后就无法让li居中对齐了
接近 2 年之前 回复
meng20166
meng20166   Rxr 2016.02.15 09:42

你不要将padding的值设为0,设为ul的默认值

qq_26946497
qq_26946497 不是我设置的,没法不设置,也不知道如何重置为默认值
接近 2 年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!