在重構程式的時候把一個 a 標籤放進 section 裡面,結果樣式就壞掉了,不但 border 跑掉,背景色也不見了。
試了一下似乎問題是 a tag 裡面遺失 block 屬性,補上 block 就沒事了。
本來想就這樣結案繼續去趕工,但以後應該也不會記得要回來查這個。為了我的複利效應只好先暫停手邊工作。
發現是 a tag 原本在外面 div 有下 flex flex-col
,移到 section 裡面只有預設的 block
,因此我的 a tag 拿到的屬性就從 block 變成 inline。
我猜是醬。
<div class="flex flex-col">
{{-- 最新活動 --}}
<div>
<div class="relative flex">
<x-decorations.title_royalblue_textcenter blue="" black="最新活動" />
</div>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4"> <!-- grid -->
@foreach( $Data['ontime']['data'] as $key => $data )
<x-cards.event :data="$data" />
@endforeach
</div>
<!-- 移動後 -->
<a class="my-12 border-2 border-royalBlue border-opacity-25 font-bold text-royalBlue hover:text-white hover:bg-royalBlue "
href="{{route('event_list',['page'=>1])}}">
<div class="flex justify-center">
<span class=" py-1 ">看更多 +</span>
</div>
</a>
</div>
<!-- 原本 -->
<a class="my-12 border-2 border-royalBlue border-opacity-25 font-bold text-royalBlue hover:text-white hover:bg-royalBlue "
href="{{route('event_list',['page'=>1])}}">
<div class="flex justify-center">
<span class=" py-1 ">看更多 +</span>
</div>
</a>
</div>