how to align all div inside a div next to each other

Question

I want to align all divs inside in a div next to each other and no other div of HTML has any effect on it

<div id="wrapper">
  <div>
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" width='50px'>
    </div>
    <div>
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" width='50px'>
    </div>
    <div>
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" width='50px'>
    </div><div>
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" width='50px'>
    </div><div>
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" width='50px'>
    </div>
    </div>

my problem is that I can no assign id/class to inside div and if I try

div{
   float:left;
}

it affect every div of that HTML I want to only align item next to each other wrapper id's divs and idea and suggestion will be appreciated

I could not understand your goal exactly. Why you don't use ```#wrapper div``` as a selector? — hamid-davodi, Sep 11 '22 at 06:31
[massive dupe](https://www.google.com/search?q=align+all+divs+inside+a+divs+next+to+each+other+flex+site%3Astackoverflow.com) — mplungjan, Sep 11 '22 at 06:40

score 0 · Accepted Answer · answered Sep 11 '22 at 06:31

You can make the wrapper a flexbox using display: flex

#wrapper {
  display: flex
}

<div id="wrapper">
  <div>
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" width='50px'>
  </div>
  <div>
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" width='50px'>
  </div>
  <div>
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" width='50px'>
  </div>
  <div>
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" width='50px'>
  </div>
  <div>
    <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" width='50px'>
  </div>
</div>

how to align all div inside a div next to each other

1 Answers1