0

I'm trying to use Flexbox containers with div elements, and want the text to be centered on one container, and at the bottom of another. I'm guessing Flexbox is preventing standard vertical-align: middle; from rendering as I expect.

I created a JSFiddle HERE to demonstrate what I have. You can see the text aligned at the top despite the CSS

What am I doing wrong to get the text alignment to where I want it?

SteveV
  • 351
  • 1
  • 6
  • 15
  • Please add an [mcve] to your post. Also for starters your selector is not being applied because there is no 2nd child in `.flex-item-nested` – TylerH Jun 21 '18 at 20:32
  • you need to make the element a flex container and then align using flex property .. not with vertical-align – Temani Afif Jun 21 '18 at 20:36
  • @steveV use align-self property for child dive you want to align and don't forget to add display:flex to parent to apply have a look this JS fiddle https://jsfiddle.net/9fwsrzu3/116/ – monikapatelIT Jun 21 '18 at 20:48
  • Thanks @monikapatel! Still very much learning Flexbox so the correction is truly appreciated – SteveV Jun 22 '18 at 20:26

0 Answers0