Mobile First | Works fine, but not sure about methods

Community feedback

• 

  Przemyslaw Pracz•280

  @rayofhope50Posted over 1 year ago

  With regards to overflow. You’re applying it to main which means everything inside will be “cut”. In order to fix that you can either:

  1. Move box on top of the main create a wrapper around it with postion:relative; (for next issue)

  2. Apply overflow:hidden; just on .left-side; or even better .images

  Changing that will make box appear, since it will be outside of the class where you apply hidden. When rest of images will be cut off.

  ~Not gonna lie that annoyed me at the end especially positioning.

  Your positioning seems fine but your <main> is expanding when you expand the answer. I would throw hard coded height value on it to prevent that. Which would also stop the box from moving when an answer is displayed.

  For your JS check .forEach() and .toggle() I understand why your js looks like this. Sometimes we do not know what we do not know I had a hard time to come up with a way to code all of them with the same class and be able to add .querySelectorAll and use eventListener so had to learn forEach().

  Also you use js for making headers bolder which should be CSS’s job. Simple .active class which you add with JS would do the trick.

  In general use HTML for a structure (that’s why I do not like on click you hard code HTML to enable js to work) CSS for styling and JS for functionality.

  On that note I use JS to change my CSS on hight of my answers during animation simply for better looks as I could do it with CSS but wouldn’t look that much smoother.

  Witam, odpisalem po angielsku bo widze, ze nie masz z nim problemu I w razie W jak by ktos mial podobny problem. Na lapku nie mam polskiej klawiatury wiec sorki za ogonki :)

  Marked as helpful

  0

  ---

  

  BBualdo•540

  @BBualdoPosted over 1 year ago

  @rayofhope50 Hi, I'm much further in JS than I was during this challenge, so now I know I should use .querySelectorAll and .forEach method :D I'm trying to focus on next projects rn, but I get everything you said, thanks a lot!

  Nie ma problemu :) jeszcze raz dzięki za podpowiedź :D

  0