element positioning

Hey, i was wondering how you'd place an element like the purple circle in a layout like this, my first instinct was position absolute but i was curious if there was a better way. Would much appreciate anyone's help with this, thank you in advance.
No description
No description
6 Replies
Chooβ™šπ•‚π•šπ•Ÿπ•˜
I would put the purple circle in a flex box. Use justify-content:flex-end in the first one and center in the second one.
snxxwyy
snxxwyyOPβ€’16mo ago
yeah that seems like a pretty good solution, the container with the input boxes seems to have a border bottom on it so that would knock that layout out which was why my mind went to absolute. Or do you recommend making that line a div in itself and a part of the flex container?
Chooβ™šπ•‚π•šπ•Ÿπ•˜
I would make that line a ::before or ::after of the flexbox that holds the circle. That makes it easier to align with the circle than making it part of the input's container.
snxxwyy
snxxwyyOPβ€’16mo ago
ah i see, thank you!
croganm
croganmβ€’16mo ago
You could indeed use absolute positioning, but I do think I'd try flex in this case as well πŸ™‚
snxxwyy
snxxwyyOPβ€’16mo ago
awesome, i appreciate the extra hand πŸ™‚
Want results from more Discord servers?
Add your server