Whenever I apply 'text-center', the text does not align horizontally and instead lines up vertically. You can see an example in this js fiddle: I am aiming for something like this: https://i.sstatic.net/oueEr.png
https://jsfiddle.net/dungvd/ey4fj6nv/2/.
test.html:
"<div>Question</div>
<div class="container">
<div class="row ">
<div class="col-sm-6 mx-auto text-center">
<h2 class="green-line">
Welcome to course bs2wp
</h2>
</div>
</div>
</div> "
test.css:
* {
margin: 0;
padding: 0;
}
h2.green-line {
position: relative;
}
h2.green-line:after {
content: "";position: absolute;
width: 65px;height: 5px;
background: green;
top: 0px;left: 0px;
}