Javascript Js倒计时文本不在边界中心

我在对齐边框内的文本时遇到问题。文本必须位于边界的中心

我设法让它在chrome上工作，但在代码笔、safari或internet explorer上不起作用。这是你的电话号码

这是我的HTML

//设置我们倒计时的日期
var countDownDate=新日期（“2018年11月5日9:30:00 GMT”）.getTime（）；
//设置所述位置的位置和时区
//var city=‘伦敦’；
//var偏移量='+1.0'；
//每1秒更新一次倒计时
var x=setInterval（函数（）{
//获取今天的日期和时间
var now=new Date（）.getTime（）；
//找出现在和倒计时日期之间的距离
var距离=倒计时日期-现在；
//周、天、小时、分钟和秒的时间计算
//var weeks=数学楼层（距离/（1000*60*60*24*7））；
变量天数=数学楼层（距离/（1000*60*60*24））；
可变小时数=数学楼层（（距离%（1000*60*60*24））/（1000*60*60））；
var分钟=数学楼层（（距离%（1000*60*60））/（1000*60））；
var秒=数学楼层（（距离%（1000*60））/1000）；
//在id=“demo”的元素中输出结果
document.getElementById（“倒计时天数”）.innerHTML=
天+“”+”
“+”天“+”；
document.getElementById（“倒计时小时”）.innerHTML=
小时数+“”+”
“+”小时数“+”；
document.getElementById（“倒计时分钟”）.innerHTML=
分钟+“”+”
“+”分钟“+”；
document.getElementById（“倒计时秒”）.innerHTML=
秒+“”+”
“+”秒“+”；
});
h2{
边框：实心1px#000；
边界半径：100%；
显示：内联flex；
填充：30px 25px；
字体大小：20px！重要；
颜色：#fff；
字号：600；
线高：25px；
高度：125px；
宽度：125px；
保证金：自动；
文本对齐：居中；
左边距：5px；
}

发射
58天
22小时
42分钟
40
秒
我更改了H2元素的弹性方向，而不是使用
span
和
br
元素，我使用了
div
元素。这就是你想要的结果吗


//设置我们倒计时的日期
var countDownDate=新日期（“2018年11月5日9:30:00 GMT”）.getTime（）；
//设置所述位置的位置和时区
//var city=‘伦敦’；
//var偏移量='+1.0'；
//每1秒更新一次倒计时
var x=setInterval（函数（）{
//获取今天的日期和时间
var now=new Date（）.getTime（）；
//找出现在和倒计时日期之间的距离
var距离=倒计时日期-现在；
//周、天、小时、分钟和秒的时间计算
//var weeks=数学楼层（距离/（1000*60*60*24*7））；
变量天数=数学楼层（距离/（1000*60*60*24））；
可变小时数=数学楼层（（距离%（1000*60*60*24））/（1000*60*60））；
var分钟=数学楼层（（距离%（1000*60*60））/（1000*60））；
var秒=数学楼层（（距离%（1000*60））/1000）；
//在id=“demo”的元素中输出结果
document.getElementById（“倒计时天数”）.innerHTML=`${Days}Days`；
document.getElementById（“倒计时小时”）.innerHTML=`${Hours}Hours`；
document.getElementById（“倒计时分钟”）.innerHTML=`${Minutes}Minutes`；
document.getElementById（“倒计时秒”）.innerHTML=`${Seconds}Seconds`；
});
h2{
对齐项目：居中；
边框：实心1px#000；
边界半径：100%；
显示：内联flex；
弯曲方向：立柱；
填充：30px 25px；
字体大小：20px！重要；
颜色：#fff；
字号：600；
线高：25px；
高度：125px；
宽度：125px；
保证金：自动；
左边距：5px；
}

发射
58天
22小时
42分钟
40
秒
使用此css而不是您的css：

.countdown {
  display: flex;
}

h2{
  border: solid 1px #000;
  border-radius: 100%;
  padding: 30px 25px;
  font-size: 20px !important;
  color: #fff;
  font-weight: 600;
  line-height: 25px;
  height: 125px;
  width: 125px;
  margin: auto;
  text-align: center;
  margin-left: 5px;
}

你的h1被放置在倒计时div上面

<div class="overlay">
  <div class="row marginnone">
   <div class="col-lg-7 col-md-12 center">
    <h1>Launch In</h1>
    <div class="countdown">
      <h2 id="Countdown_Days">58<span><br>Days</span></h2>
      <h2 id="Countdown_Hours">22<span><br>Hours</span></h2>
      <h2 id="Countdown_Minutes">42<span><br>Minutes</span></h2>
      <h2 id="Countdown_Seconds">40<span><br>Seconds</span></h2>
    </div>
   </div>
  </div>
 </div>


发射
58天
22小时
42分钟
40
秒
是的，谢谢！在我将其标记为正确之前，让我检查一下safari&IE。