0

I have been trying to display the trying to print the posters using foreach() loop, It displays only in the single column, use of class is not giving correct output instead it is making column inside one another because of the loop, how can I display the images in grid layer

Below is my code,

movies.forEach(movie => {
  output += `
    <div class="block">
      <div>
         <a onclick="movieSelected('${movie.imdbID}')" href="#">
           <img src="${movie.Poster}" class="box-1 border">
         </a>
       </div>
    <div>`
})

and display the html using the innerhtml()

Inizio
  • 2,226
  • 15
  • 18
gamer
  • 11
  • 1
  • _“use of class is not giving correct ouput”_ - impossible for us to tell what “correct” or “incorrect” would even be here, because we have no idea what that class is supposed to actually achieve, and how. Please provide a _proper_ [mre] that illustrates your problem. – 04FS Nov 11 '19 at 13:32
  • .column{ float: left; width: 33.33%; } if we add the class to seperate this is gonna creating inner columns not grid – gamer Nov 11 '19 at 13:47
  • There is no `column` class set on anything in that snippet you have shown us. Please don’t respond with such minimal snippets in comments, but do as you were asked to - provide a _proper_ [mre]. – 04FS Nov 11 '19 at 13:48

0 Answers0