位于Y和X中间的内容

-2

所以我不希望我的内容位于沿X轴的中间位置，我希望Y轴中间的内容位于。位于Y和X中间的内容

在我的CSS我用以下，以防止页面成为任何大

html { overflow-y: hidden; overflow-x: hidden }

以下是我想达到的目标。举一个例子，想象一下中间的一个盒子。我相信这可以用JavaScript来完成，我只是不知道如何。

所以上图中示出了在两个X和Y轴的中间的框。 请不要发布如何将其放置在X轴的中间位置，因为这不是我想要的。任何帮助将很棒，谢谢！

来源

2016-02-25 Munch

http://howtocenterincss.com/ – pawel

可能[div中的中心内容与CSS]的副本（http://stackoverflow.com/questions/4374650/center-content-in-div-with-css） – Paul

设置你的格或框的CSS属性..

div { 
    /* These first 3 can change */ 
    background: red; 
    width: 100px; 
    height: 100px; 
    /* The important stuff below */ 
    bottom: 0; 
    left: 0; 
    margin: auto; 
    position: absolute; 
    top: 0; 
    right: 0; 

}

看到它在行动中的JS Fiddle

来源

2016-02-25 21:00:12

您可以使用以下函数来相对于父元素沿任一轴动态居中。父容器的overflow属性设置为隐藏，并且子元素的marginTop值设置的值：中心（孩子宽度，父母宽）

center= function(Win,Wout){ 
    return (Wout-Win)/2 
}

来源

2016-02-25 20:49:35 nick

你可以用javascript做到这一点，尼克说，但CSS也是一个选项？如果要垂直居中用CSS子元素，你可以这样做，如本的jsfiddle https://jsfiddle.net/bjf10vyj/ 父位置必须是相对的，那么孩子

position: absolute;  
top: 50%; 
transform: translateY(-50%);

来源

2016-02-25 21:02:17 Observer

位于Y和X中间的内容

回答

相关问题