# I'd like to know how to align horizontally like this **URL:** \ **Category:** General\ **Created:** [June 20, 2020, 1:42pm UTC](https://forum.freecodecamp.org/t/id-like-to-know-how-to-align-horizontally-like-this/406229 "2020-06-20T13:42:37Z")\ **Posts on this page:** 6\ **Page:** 1
**Author:** ![marios96](https://avatars.discourse-cdn.com/v4/letter/m/c2a13f/32.png) [@marios96](https://forum.freecodecamp.org/u/marios96)\ **Post date:** [June 20, 2020, 1:42pm UTC](https://forum.freecodecamp.org/t/id-like-to-know-how-to-align-horizontally-like-this/406229/1 "2020-06-20T13:42:37Z")
I was working on the second project which is to create a survey form and I was looking at different survey forms to get some ideas. I found this restaurant one and tried to replicate it using flexbox. [Link](https://www.jotform.com/form-templates/restaurant-evaluation-survey) I can’t for the life of me understand how they aligned the text on the left and the radio buttons on the right while also keeping them on the same height if that makes sense. Can someone give any advice on how they did this? ---
**Author:** ![Naomi](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/naomi/32/422181_2.png) [@Naomi](https://forum.freecodecamp.org/u/Naomi)\ **Post date:** [June 20, 2020, 2:31pm UTC](https://forum.freecodecamp.org/t/id-like-to-know-how-to-align-horizontally-like-this/406229/2 "2020-06-20T14:31:27Z")
Hello~! I recommend using your browser’s Developer Tools to view the HTML and CSS for those elements - you can look at the code to get a sense of how they accomplished the layout. It looks like they used `float` and `position` to achieve this, but I cannot be sure without some further digging. ---
**Author:** ![sobadrdb](https://avatars.discourse-cdn.com/v4/letter/s/a8b319/32.png) [@sobadrdb](https://forum.freecodecamp.org/u/sobadrdb)\ **Post date:** [June 20, 2020, 5:42pm UTC](https://forum.freecodecamp.org/t/id-like-to-know-how-to-align-horizontally-like-this/406229/3 "2020-06-20T17:42:24Z")
hi @marios96 actually you can achieve that using flex, here is my survey form example using flex > [@Feedback please on my practicing project](http://forum.freecodecamp.org/t/feedback-please-on-my-practicing-project/399352): > > hi campers, edit: done retouched up the technical docs. #4 technical docs: #3 landing page: #2 survey project: portofolio project #5 side note: the stuff for head it not necessary, but it just easier for me to copy paste it to w3c validator, try to find errors. the diffrence is, i filled up both flex side by side with radio, while you want left only for text question, and the right side for radio buttons. the basic came from examples here (scroll down to example section) and the last example demo. > **[A Complete Guide to Flexbox | CSS-Tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#flexbox-examples)** > > Our comprehensive guide to CSS flexbox layout. This complete guide explains everything about flexbox, focusing on all the different possible properties for the parent element (the flex container) and the child elements (the flex items). It also... regards ---
**Author:** ![marios96](https://avatars.discourse-cdn.com/v4/letter/m/c2a13f/32.png) [@marios96](https://forum.freecodecamp.org/u/marios96)\ **Post date:** [June 21, 2020, 10:42am UTC](https://forum.freecodecamp.org/t/id-like-to-know-how-to-align-horizontally-like-this/406229/4 "2020-06-21T10:42:14Z")
Yeah, seems like I have to get into the habit of reading code. It’s still kinda hard to understand code other people wrote but I’m slowly getting used to it, I’ve been reading some more pens trying to understand how other people structure their code. Thank you for your answer! ---
**Author:** ![marios96](https://avatars.discourse-cdn.com/v4/letter/m/c2a13f/32.png) [@marios96](https://forum.freecodecamp.org/u/marios96)\ **Post date:** [June 21, 2020, 10:44am UTC](https://forum.freecodecamp.org/t/id-like-to-know-how-to-align-horizontally-like-this/406229/5 "2020-06-21T10:44:22Z")
Very interesting. I like your projects a lot. Definitely got some ideas from this. Thank you for your answer! ---
**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\ **Post date:** [June 1, 2021, 6:49pm UTC](https://forum.freecodecamp.org/t/id-like-to-know-how-to-align-horizontally-like-this/406229/6 "2021-06-01T18:49:33Z")
Closed on June 1, 2021, 6:49pm UTC