我能够为我的评级功能实现rateit.js。
当涉及到后端时，它工作得很好。
但是前端看起来很混乱。

我很难找到问题所在
这是这个图书馆的bug。
我想问聊天gpt。不过，最好是人类回答。
下面是后端如何

<div class="feedback--container">
<div class="feedback__star">
<input type="range" min="0" max="5" value="0" step="0.5" id="backing3" name="ratings">
<div class="rateit" data-rateit-backingfld="#backing3" data-rateit-mode="font"  style="font-size:70px">
 </div>
 </div>
 <div class="feedback__content">
 <textarea class="form-control" placeholder="Enter description.." name="description"> 
 </textarea>
 </div>
 </div>

@section（'extra-script'）

<link rel="stylesheet" type="text/css" href=" 
 {{asset('public/pwa_asset/assets/plugins/rateit/scripts/rateit.css')}}" />

<script type="text/javascript" src="{{asset('public/pwa_asset/assets/plugins/webfont/webfont.js')}}"></script>

<script type="text/javascript" src="{{asset('public/pwa_asset/assets/plugins/rateit/scripts/jquery.rateit.min.js')}}"></script>

<script>
    
    $('.card--slider__container').slick({
        dots: true,
        infinite: true,
        speed: 300,
        slidesToShow: 1,
        centerMode: true,
        variableWidth: true
    });

</script>

 @endsection