Alignment: 07-flex-layout-2 missing CSS in the solutions
Closed this issue · 2 comments
Checks
- This is not a duplicate of an existing issue (please have a look through our open issues list to make sure)
- I have thoroughly read and understand The Odin Project Contributing Guide
- Would you like to work on this issue?
Describe your suggestion
In the task '07-flex-layout-2' the CSS solution details the following changes in order to fix the list-items in the sidebar:
ul { list-style-type: none; margin: 0; padding: 0; }
However, this will not make the solution match the desired outcome, as the desired outcome has significantly more space between the link items.
To fix this, a few additional CSS properties need to be added:
ul { list-style-type: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px }
Path
Foundations
Lesson Url
https://www.theodinproject.com/lessons/foundations-alignment
(Optional) Discord Name
No response
(Optional) Additional Comments
No response
Thanks for opening this issue @wishyrater, I've transferred this to the CSS exercises repo where the exercises are kept (and where any changes would need to be done if we need to do changes).
I've opened the solution HTML and CSS and compared that to the desired outcome images, as well as when the ul has the additional CSS properties as you've highlighted above.
You can see this comparison below.
Leftmost is with the additional flex properties, middle is the current solution CSS, and rightmost is the desired outcome image.
So based on that, we shouldn't need any additional CSS for the solution.
Closing as cannot reproduce original issue.