how to align content of a so that they are vertically

Question

Is it possible to have the content of a div vertically centred?

<div style="padding-left: 15px; vertical-align: middle; align-content: center" >
      <h3>Selections</h3>
</div>

I want the text left aligned and in the vertical middle

Answer 1

I gave you an example of vertical alignment using flex rules. In this case, the vertical alignment occurs with the help of an align-item: center. Also, you need space for vertical alignment.

body {
   padding: 0;
   margin: 0;
   box-sizing: border-box;
}

div {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

<div>
   <h3>Selections</h3>
</div>

Answer 2

Well it's an easy property you can set. You can set the text-align property. You can read more about this below.

https://www.w3schools.com/cssref/pr_text_text-align.ASP

for vertical centering:

https://www.w3schools.com/css/css_align.asp

Answer 3

You want to use the CSS property text-align. Also remove the inline 'style' you have on your div and use a css file

.center-content {
     text-align: center;
     width: 100%;
}

<div class="center-content">
     hello world
</div>

Answer 4

If you are oke with setting the height of the h3 tag, you can do this:

h3{
  height: 4%;
  margin-top: 48%;
  margin-bottom: 48%;
}

Otherwise do this;

h3{
  margin-top: 50%;
  margin-bottom: 50%;
}