Flex centering isnt working ? | Sololearn: Learn to code for FREE!

+1

Flex centering isnt working ?

this is my code <div style="display:flex;"> <div style="margin:auto;;"> <h2 class="form-title" >Search for the investment oportunities :</h2><br /> </div> </div>

6/28/2019 4:36:54 PM

Maaz Masood

2 Answers

New Answer

+4

1. You haven't specified how the items within the container should be aligned; you only have indicated that's flex. Try using "justify-content: center;" for horizontally centered alignment and "align-items: middle" for vertically centered alignment in the outer container if you want all the items within it to be aligned. 2. "margin: auto" will only work with elements with defined dimensions. Try adding a width or a height, but maybe this div isn't necessary if your approach is the use of flex. 3. "<h2>...</h2>" has a full width, so the centering won't be visible. It's different center an element and center an element's content. Hope this code helps you: https://code.sololearn.com/WF47FTo2hgN1/?ref=app

+1

Thank You @Marfik Em. Appreciated <3