有这样一段代码，怎样把它弄成横向滚动？

Question

<style>

    

.peizhi_list ul li{

float:left;

margin-left:10%;

margin-top:5px;

}

.peizhi_list  .yuan{

width:55px;

height:55px;

border:#53a8e8 solid 1px;

border-radius:50px;

}

</style>

<div class="peizhi_list" style="text-align: center;

max-width: 100%;

min-width: 320px;

max-height: 107px;

overflow-y: hidden;">

      <ul class="p_list">

        <li>

            <div class="yuan fl">

                    <div class="pic"></div>

                    </div>

                <div class="mt10"><p>HUD抬头</p><p>数字显示</p></div>

            </li>

            <li>

            <div class="yuan fl">

                    <div class="pic"></div>

                    </div>

                <div class="mt10"><p>电动座椅</p></div>

            </li>

            <li>

            <div class="yuan fl">

                    <div class="pic"></div>

                    </div>

                <div class="mt10"><p>环境氛围</p><p>照明系统</p></div>

            </li>

            <li>

            <div class="yuan fl">

                    <div class="pic"></div>

                    </div>

                <div class="mt10"><p>倒车影像</p></div>

            </li>

            <li>

            <div class="yuan fl">

                    <div class="pic"></div>

                    </div>

                <div class="mt10"><p>车身高度</p><p>可调</p></div>

            </li>

            <li>

            <div class="yuan fl">

                    <div class="pic"></div>

                    </div>

                <div class="mt10"><p>外后视镜</p><p>电动折叠</p></div>

            </li>

            <li>

            <div class="yuan fl">

                    <div class="pic"></div>

                    </div>

                <div class="mt10"><p>导航系统</p></div>

            </li>

            

        </ul>

    </div>