larave 画像を順番に表示させたい

前提・実現したいこと

blade.phpに@foreach文を用い順番に画像を表示させたいです。

発生している問題

以下を記述していましたが、今は、一つづつidに、cssで、leftと用いずらして表示しています。

blade.php
1   @foreach($pickup_books AS $pickup_book)
2  	<div id="photo" class="pic"><a href="#">
3        <img src = "{{'/storage/'. $pickup_book['image'] }}">
4      </a></div>
5    @endforeach

該当のソースコード

php
1<div id="stage">
2  <div id="photos">
3    <div id="photo1" class="pic"><a href="#"><img src="foge.jpg"></a></div>
4    <div id="photo2" class="pic"><a href="#"><img src="foge.jpg"></a></div>
5    <div id="photo3" class="pic"><a href="#"><img src="foge.jpg"></a></div>
6    <div id="photo4" class="pic"><a href="#"><img src="foge.jpg"></a></div>
7    <div id="photo5" class="pic"><a href="#"><img src="foge.jpg"></a></div>
8 </div>
9</div>

css
1#stage {
2	position: relative;
3	width: 90%;
4	overflow: hidden;
5}
6#photos {
7	position: absolute;
8
9}
10.pic {
11	width:20%;
12	position:absolute;
13}
14.pic img { width:90%; }
15#photo1 { left:0%; }
16#photo2 { left:20%; }
17#photo3 { left:40%; }
18#photo4 { left:60%; }
19#photo5 { left:80%; }
20

HomeController.php
1public function index()
2{
3$pickup_books = Book::inRandomOrder()->where('status', 1)->get();//ランダムにstatusが1の全て取得
4return view('home', compact('pickup_books'));
5}