playing with mobile display for tables

public/css/jk.css

@@ -14,9 +14,12 @@
 	text-align:center;
 	padding:10px;
 }
-.editbutton, .deletebutton{
+#buttons form{
 	display:inline;
 }
+.editbutton, .deletebutton{
+	display:inline-block;
+}
 @media (max-width:575.98px){
 
 .col-md-12{

resources/views/beers/index.blade.php

@@ -32,12 +32,12 @@
 		<td><a href="/brewery/{{$beer->brewery_id}}">{{$beer->brewery}}</a> </td>
 		<td>{{$beer->type}} </td>
     @if (Auth::user()->isAdmin())
-<td><a href="{{ route('beers.edit',$beer->beer_id)}}" class="btn btn-primary editbutton">Edit</a>
+<td><span id="buttons"><a href="{{ route('beers.edit',$beer->beer_id)}}" class="btn btn-primary editbutton">Edit</a>
 <form action="{{ route('beers.destroy', $beer->beer_id)}}" method="post">
   @csrf
   @method('DELETE')
   <button class="btn btn-danger deletebutton" type="submit">Delete</button>
-</form></td>
+</form></span></td>
 @endif
 
               </tr>