Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialChristopher 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
229,732 PointsA few ways come to mind:
- If the elements have
display: inline
orinline-block
(and not too wide) they will appear side-by-side naturally. - if they are
position: absolute
you 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
229,732 PointsSteven Parker
229,732 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.