@SJ-Nosrat
Posted
Hi Anna, Wonderful solution! I've looked at your CSS and noticed the following;
- On the
.faq-textclass; you can change theoverflow-y: auto;tooverflow-y: hidden;that'll get rid of the scroll when you open the accordian. - With regards to positioning the box; you can remove the
transformproperty and add:top: 8.85rem;andleft: -7rem;that should place the box nicely giving the shadow effect. Or as you've usedtransformwith the following values:transform: translateX(-62%) translateY(35%);either approach is perfectly fine; that's the beauty of coding.
With regards to negative values, MDN documentation mentions the following for top: A negative, null, or positive <length> so it's perfectly fine to use negative values.
Once again well done! Looking forward to your other solutions!
Keep on coding and best of luck with your coding journey!
Marked as helpful
@annab6
Posted
@shahin1987 Hello and thank you very much for your attentive feedback and advice! I´ve changed the position of the cube according to your advice and now it looks much better! As for scroll, I´ve added it on purpose, otherwise, it is impossible to see all the questions (when a couple of answers are opened). I´ve also found your comments about semantic markup to James solution (https://www.frontendmentor.io/solutions/completed-using-html-css-javascript-M7hrZVqIU), and already changed my HTML according to your advice! Thanks for the help, we, newbies need it a looot!
