相关疑难解决方法(0)

我试图垂直居中我的标签内容,但是当我添加CSS样式时display:inline-flex,水平文本对齐消失.

如何为每个标签创建文本对齐x和y？

* { box-sizing: border-box; }
#leftFrame {
  background-color: green;
  position: absolute;
  left: 0;
  right: 60%;
  top: 0;
  bottom: 0;
}
#leftFrame #tabs {
  background-color: red;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 25%;
}
#leftFrame #tabs div {
  border: 2px solid black;
  position: static;
  float: left;
  width: 50%;
  height: 100%;
  text-align: center;
  display: inline-flex;
  align-items: center;
}

<div id=leftFrame>
  <div id=tabs>
    <div>first</div>
    <div>second</div>
  </div>
</div>

在html中垂直居中文本的最佳和最简单方法是什么？需要是浏览器版本/类型不可知.一个纯粹的html/CSS解决方案.

我正在使用这个脚本水平和垂直居中我的div.

当页面加载时,div会垂直居中,而不是水平居中,直到我调整浏览器大小.

我究竟做错了什么？

$(document).ready(function (){
    $(window).resize(function (){
        $('.className').css({
            position:'absolute',
            left: ($(window).width() - $('.className').outerWidth())/2,
            top: ($(window).height() - $('.className').outerHeight())/2
        });
    });
    $(window).resize();
});

我发现在页面上垂直对齐一些元素是有问题的,而不改变其他元素布局.

这个问题在移动设备上被放大了.如此多的屏幕尺寸,分辨率,肖像,风景......

var x=window.innerHeight - $('#myDiv').height();
    $('#myDiv').css ('margin-top', x/2);

这适用于所有设备,移动设备和桌面设备.你认为这些方法有任何缺点吗？

据我所知,今天所有设备都支持JavaScript.但是,某些设备是否可能支持JS但不支持jQuery？