안녕하세요.

현재 슬라이드 만드는법을

오픈소스를 보며 공부히고 있는데요

궁금한게 있어 질문올립니다.

-------------------------------------html

<div class='slide-container'>
        <div class='slide-view'>
            <ul class='slide-wrap'> <!-- 애미메이션 슬라이드박스 -->
                <li class='slide slide2'></li>
                <li class='slide slide0'></li>
                <li class='slide slide1'></li>
                <li class='slide slide2'></li>
                <li class='slide slide0'></li>
            </ul>
        </div>
        
        <span class='nextBt-wrap'>
            <a href='javascript:void(0);' class='nextBt'>
                <img src='img/visu_slick_next.png' alt=''>
            </a>
        </span>
        
        <span class='prevBt-wrap'>
            <a href='javascript:void(0);' class='prevBt'>
                <img src='img/visu_slick_prev.png' alt=''>
            </a>
        </span>
        
    </div>    

-------------------------------------css 

@charset "utf-8";

* { margin:0; padding:0; vertical-align:top; }
html,body{ width:100%; height:100%; }
body { text-align:center; font:20px/1 '굴림', 'arial'; color:#333; background:#fff; }
ul { list-style:none; }

.slide-container { position:relative; width:100%; }

.slide-container .slide-view { z-index:1; position:relative;  width:100%; overflow:visible; }
.slide-container .slide-view .slide-wrap { position:relative; width:calc(100%*5); height:969px; margin-left:-100%; }
.slide-container .slide-view .slide-wrap:after { content:''; display:block; clear:both; }
.slide-container .slide-view .slide-wrap .slide { float:left; width:100%; max-width:1903px; height:969px; }
.slide-container .slide-view .slide-wrap .slide.slide0 { background:url(../img/slide1.jpg) no-repeat 50% 100%; background-size:cover; }
.slide-container .slide-view .slide-wrap .slide.slide1 { background:url(../img/slide2.jpg) no-repeat 50% 100%; background-size:cover; }
.slide-container .slide-view .slide-wrap .slide.slide2 { background:url(../img/slide3.jpg) no-repeat 50% 100%; background-size:cover; }

.nextBt-wrap { z-index:2; position:absolute; top:50%; margin-top:-50px; right:70px; width:52px; height:100px; }
.nextBt-wrap a img { width:100%; }

.prevBt-wrap { z-index:2; position:absolute; top:50%; margin-top:-50px; left:70px;  width:52px; height:100px; }
.prevBt-wrap a img { width:100%; }
 

중간에 빨간표시로 된 부분을 보면

슬라이드의 ul의 max-width가 1903px로 

지정되있는데 왜 1920px이 아닌 1903px로 지정했는지 궁금합니다.

또한 .slide-container .slide-view .slide-wrap 에서 

왜 clac(100%*5)------>넓이 500%로 지정했는지도 궁금합니다..(돌아가는 이미지가 5개라 그런건지...)

구글에 검색해도 안나오네요 ㅠㅠ

도움 부탁드립니다......ㅜㅜ