[英]Reducing the width of div moves to left side in css
Here is the 这里是
http://jsfiddle.net/vicky081/jmGwX/5/ I want to change the width of the div which is now 100% when i change the width to 50% the div appear left side. http://jsfiddle.net/vicky081/jmGwX/5/我想更改div的宽度,当我将宽度更改为50%时,div的宽度现在变为100%,出现在左侧。 How can i make that div as center by this when i reduce the size of the div it appear from the center is it possible? 当我减小从中心出现的div的尺寸时,如何以此将div作为中心? I know the width of the div is 100%
then it appear like from left 0 to right 100
if i change the width to 50 also it appear from left to 50% right
Is there is a way to show it from center when i change the width it appear both for example: if i reduce the width of the div is 50%
then it appear like 25% from center of left and 25% center of right
我知道div的宽度是100%
那么如果我将宽度更改为50,它也会left 0 to right 100
出现,而且它也会left to 50% right
出现。当我更改例如,如果我将div的宽度减小50%
那么它的宽度就好像出现25% from center of left and 25% center of right
Here is the code CSS: 这是代码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;
}
Edit your CSS like here: 像这样编辑CSS:
.notify {
....
margin: 0 auto 0 auto;
....
}
http://jsfiddle.net/wRM8j/ http://jsfiddle.net/wRM8j/
EDIT: 编辑:
If position
is fixed
add 如果position
fixed
添加
.notify {
....
position: fixed;
left: 0;
right: 0;
....
}
The first Solution is perfect but in case you want to play with that using javascript. 第一个解决方案是完美的,但是如果您想使用javascript来解决这个问题。 Just include this line. 只需包括这一行。
<script>
var decider=parseInt(document.defaultView.getComputedStyle(document.getElementsByTagName("div")[0]).width)/2;
document.getElementsByTagName("div")[0].style.left=(window.innerWidth/2)-decider;
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.