jezuit azus
jezuit azus

Reputation: 161

Make table-cell 100% width of parent

How would I make the table-cell 100% width of the parent.

It works perfectly fine when the text is long enough to reach the full width of the element but when the text is not it doesn't want to center whilst using table-cell and vertical-align: middle;

Here is a fiddle:

https://jsfiddle.net/DTcHh/7471/

Upvotes: 2

Views: 1092

Answers (1)

Dan Beaulieu
Dan Beaulieu

Reputation: 19984

Update:

Here's a better solution using a flex-box:

jsFiddle

h4 {
    height: 50px;
    font-size: 1em;
    width: 100%;
    font-style: oblique;
    color: #FFF;
    text-align: center;
    margin-left: 5px;
    display: flex;
    justify-content: center; /* align horizontal */
    align-items: center; /* align vertical */
   }

Upvotes: 2

Related Questions