Welcome to the Treehouse Community
The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.
Christopher Anderson
1,601 Pointshow to put an element side by side
how to put an element side by side without using float and please tll me as many ways as possible
1 Answer
Steven Parker
221,292 PointsA few ways come to mind:
- If the elements have
display: inlineorinline-block(and not too wide) they will appear side-by-side naturally. - if they are
position: absoluteyou can place them wherever you like using offsets. - if they are flex items and the container has
flex-direction: row(the default) orrow-reverse - if they are in a multi-column container (using
column-count) - if they are cells on the same row in an HTML table
- if they are contained inside other elements that are arranged using any of the above methods
The best choice might be determined by what other conditions you need to accommodate.
Owa Aquino
19,277 PointsOwa Aquino
19,277 Pointsjust to add.. you can always use float properties.
check the float properties here: https://developer.mozilla.org/en/docs/Web/CSS/float
Steven Parker
221,292 PointsSteven Parker
221,292 PointsOwa, The original quesiton was "how to put an element side by side without using float..."
Owa Aquino
19,277 PointsOwa Aquino
19,277 PointsOhw sorry!.. my bad.. i didn't bother to read the description.