Functionally and aesthetically, I’m pleased with my project, but even thou the wrapper #quote-box looks centered to me, it fails the CSS tests. It passed the test originally, but once I played a bit more with the CSS it started failing. I assume it might have been when I made the wrapper a flexbox, or when I took the author text off-center. I spent some time troubleshooting but since I don’t know specifically what the tests are looking for, I’d like to hear if there’s anything basic I’m missing here.
Thank you for your help, and lasjorg if you see it - I got React/Redux on the bag now
Your code so far
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:130.0) Gecko/20100101 Firefox/130.0
Challenge Information:
Front End Development Libraries Projects - Build a Random Quote Machine
Hm, that’s interesting. I tested a few more times in my browser, and realized that horizontal center test fails when the view has the editor on the left side, but passes if I have the editor on top. So quirky
Either way, thank you for checking it out for me. Not sure if it’s a matter of changing how the test looks at it, or a recommendation to use the editor on top before running the tests, but I assume there’s a way of avoiding this type of situation.
As long as #quote-box is full width, it can’t be centered. It is the element that needs to be centered, not just its content. Give it a max-width and an auto margin to center it.
