Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

flex: 06-flex-layout: README.md: Improve self check clarity #360

Merged

Conversation

SupraSensum
Copy link
Contributor

  • This is to keep with the flex spirit
  • Another solution might instead be to nest .input and .buttons into their own container, then apply the gap property to that container. This solves the visually uneven spacing between and .input

Because

README.md says "There is space between the logo, input and buttons", but the related solution.css only gives space between the input and buttons via "margin-bottom: 16px;" applied to .input

This improves clarity of the README.md "Self Check" section by adding actual CSS "space between the logo, input and buttons", instead of the current arrangement with space only between the input and buttons.

This PR

  • remove margin-bottom: 16px; from .input
  • use gap: 16px instead on their container: .content

Issue

Closes #349

Additional Information

Pull Request Requirements

  • I have thoroughly read and understand The Odin Project Contributing Guide
  • The title of this PR follows the location of change: brief description of change format, e.g. 01-flex-center: Update self check
  • The Because section summarizes the reason for this PR
  • The This PR section has a bullet point list describing the changes in this PR
  • If this PR addresses an open issue, it is linked in the Issue section
  • If applicable, I have ensured that the TOP solution files match the Desired Outcome image

- This is to keep with the flex spirit
- Another solution might instead be to nest .input and .buttons into
   their own container, then apply the gap property to that container.
   This solves the visually uneven spacing between <img> and .input
@codyloyd codyloyd merged commit 9ab349e into TheOdinProject:main Aug 14, 2023
@SupraSensum SupraSensum deleted the increase_self_check_clarity branch August 17, 2023 21:20
AngryBabushka pushed a commit to AngryBabushka/css-exercises that referenced this pull request Feb 23, 2024
…check_clarity

flex: 06-flex-layout: README.md: Improve self check clarity
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Easy Fix - flex: 06-flex-layout: README.md self check appears to be inconsistent with solution.css
2 participants