减小div的宽度在css中移动到左侧

时间:2013-08-31 14:46:23

标签: html css

这是

http://jsfiddle.net/vicky081/jmGwX/5/当我将宽度更改为50%时,我想更改div的宽度,现在是100%div显示在左侧。当我减少从中心出现的div的大小时,我怎么能将div作为中心呢? 我知道div的宽度为100%然后它显示为来自left 0 to right 100,如果我将宽度更改为50,它也会显示为left to 50% right是否有办法从中心显示我改变它出现的宽度,例如:如果我减少div的宽度是50%,那么它看起来像25% from center of left and 25% center of right

以下是代码CSS:

.notify {
    background: #FFFFFF;
    width:50%;
    position: relative; 
    margin:-13px 0px 0px -5px;
    padding: 2px 0px 0px 0px;   
    border-bottom:2px solid #CC0000;
    box-shadow: 0px 4px 5px #AAAAAA;
    font-size:14px;
    font-family: 'Lato Regular', Arial;
    text-transform:uppercase;
    text-align:center;
}

2 个答案:

答案 0 :(得分:2)

像这里编辑你的CSS:

.notify {
    ....
    margin: 0 auto 0 auto;
    ....
}

http://jsfiddle.net/wRM8j/

修改

如果positionfixed,则添加

.notify {
    ....
    position: fixed;
    left: 0;
    right: 0;
    ....
}

http://jsfiddle.net/vZexH/

答案 1 :(得分:1)

第一个解决方案是完美的,但如果你想使用javascript玩它。 只需包括这一行。

<script>
var decider=parseInt(document.defaultView.getComputedStyle(document.getElementsByTagName("div")[0]).width)/2;
document.getElementsByTagName("div")[0].style.left=(window.innerWidth/2)-decider;
</script>