центр текста внутри div

Question

Мне хотелось бы знать, как можно центрировать мой текст внутри div. в моем коде это не работает для каждого p-тега, потому что длина текста не одинакова.

HTML: -

<div class="textBlock"> 
    <p>text text text</p> 
</div> 

CSS: -

#content .textBlock { 
position: relative; 
text-align: center; 
width: 100%; 
float: left; 
display: block; 
min-height: 160px; 
} 

#content .textBlock p { 
position: absolute; 
top: 50%; 
-webkit-transform: translateY(-50%); 
-ms-transform: translateY(-50%); 
transform: translateY(-50%); 
font-size: 28px; 
font-family: Helvetica, Arial; 
font-weight: 100; 
padding: 0 5%; 
line-height: 34px; 
letter-spacing: 0.1em; 
} 

Answer 1

не уверен, что все другие коды, если вы будете только совместив текст?

.textBlock { 
 
text-align: center; 
 
min-height: 160px; 
 
} 
 

 
.textBlock p { 
 
font-size: 28px; 
 
font-family: Helvetica, Arial; 
 
line-height: 34px; 
 
letter-spacing: 0.1em; 
 
}

<div class="textBlock"> 
 
    <p>text text text</p> 
 
</div>

Answer 2

пожалуйста попробуйте это:

Html:

<div class="textBlock"> 
    <p>text text text</p> 
</div> 

Css:

.textBlock { 
text-align: center; 

    background-color:gray; 
} 

.textBlock p { 
font-size: 28px; 
font-family: Helvetica, Arial; 
line-height: 34px; 
letter-spacing: 0.1em; 
    color:white; 
} 

DEMO