Hi so in my codepen link on the first box on the left it is a white box with round corners, I would like to be able to have a black border going around these round corners but I am unsure how to do it.
I am very sorry about how messy the code and stuff is but I will fix, another quick question is the best way to move stuff around (position: relative; and then top: , bottom: ) or should I just use margins/paddings? thx.
If you just use the border property (border: 2px black solid for example), the corner will automatically be rounded.
you can just use the ‘border-raduis:10px;’ property
thank you for helping me out!
I’m glad that I could help. Happy coding!
You really shouldn’t use positioning to place elements on the page, unless some very specific layout calls for it.
Sometimes you need to place child elements inside containers in some location that normal document flow won’t allow for, using position relative on the container and position absolute on the child. Or sometime you may want some overlap that can’t be done with normal document flow, either using positioning or negative margins. You want to use the normal document flow as much as possible when doing the layout.
Do you want the three sections to be side by side in a three-column layout? If so, you can use Flexbox for that.