Hello i want to ask something related to flexbox cross axis alignment. In the image above, i’m trying to center vertically the input (search) element. What is the best way to do that?
Thanks in advance.
Hello i want to ask something related to flexbox cross axis alignment. In the image above, i’m trying to center vertically the input (search) element. What is the best way to do that?
Thanks in advance.
Hi @ricojrico
I’m not quite sure why you posted in the “WebThings” category and not “MDN”. “WebThings” is for IoT devices. You should change the category to MDN. But nevertheless I found your post
If those elements with yellow borders are flex elements you have two possibilities:
align-items: center;
on the parent (where display: flex
is set) to vertically align all of themalign-self: center;
on the flex element itself to vertically align just this itemIf this doesn’t work it would be helpful to post the code in codepen.io so I can see the code.
Hope it helps!
Michael
I apologize for the mistake, looks like i’m not reading the sub-category fully. Thank you for the solution, i will try them and report the result later. Once again, i’m sorry for the inconvenience and thanks a lot! @miko