左填充 html,HTML - 填充左，但保持文字居中

#page {

background-color: #000;

color: #fff;

height: 360px;

width: 360px;

min-height: 100%;

}

#viewport {

font-size: 20pt;

text-align: center;

}

.taskTitle {

height: 13%;

font-weight: bold;

font-size: 30pt;

white-space: nowrap;

display: inline-block;

}

.taskNote {

color: gray;

white-space: nowrap;

}

Long text overlays picture :(

My Note 1

Short

Short text should always centerd in page!

我将有如下：

显示pciture总是在屏幕左侧

始终在父div的垂直中心显示图片

中心文本(标题和说明)总是在屏幕中心

文本不应该覆盖图片

我怎么能这样做？

2017-01-06

Daniel