在背景图片上居中文字

Question

我有一张背景图片。它包含另一个显示总价格。

Live demo

当设备屏幕小，数字0到显示在所述背景图像的中间和底心：

当我调整画面（大）该数字不再像第一次截图一样被窃听：

如何在将屏幕调整为较大的w后显示0宽度与第一张照片一样？

Answer 1

我建议给予0-DIV静态宽度：

.total{ 
position:absolute; 
background-color:aqua; 
font-weight: bold; 
font-size:10px; 
text-align:center; 
width: 40px; <---- 
left: 5%; 
bottom:14px; 
} 

Answer 2

添加此

.divThree:after { 
    content: ""; 
    display: inline-block; 
    vertical-align: middle; 
    height: 100%; 
} 

和改变。总

.total{ 
    background-color:aqua; 
    font-weight: bold; 
    font-size:10px; 
    text-align:center; 
    width: 90%; 
    vertical-align: middle; 
    display: inline-block; 
} 

Working Fiddle