브라우저 창으로 웹 페이지 크기 조정

Question

브라우저 창에서 웹 페이지의 내용을 올바르게 조정하고 싶습니다. 창 크기를 변경하면 제목이 왼쪽으로 이동하지만 다음 및 이전 창은 텍스트 중심에있는 대신 웹 페이지 중간에 있습니다. 내가 당신의 질문을 이해 있는지 확실하지 않습니다

<div class="slideshow-container"> 

<div class="mySlides"> 
<div id="title"> 
`<p>______</p>` 
</div> 

<a class="prev" onclick="plusSlides(-1)">&#10094;</a> <a class="next" onclick="plusSlides(1)">&#10095;</a>

CSS를

#title { 
position: static; 
top: 50%; 
width: auto; 
padding: 16px; 
margin-top: -22px; 
color: #D9BFFF; 
font-family: Times; 
font-size: 25px; 
text-decoration: none; 
} 

.prev, .next { 
cursor: pointer; 
position: absolute; 
top: 250px; 
width: auto; 
padding: 16px; 
margin-left: 450px; 
margin-top: -22px; 
color: #D9BFFF; 
font-weight: bold; 
font-size: 18px; 
transition: 0.6s ease; 
border-radius: 0 3px 3px 0; 
} 

.next { 
margin-left: 850px; 
border-radius: 3px 0 0 3px; 
} 

.prev:hover, .next:hover, .active { 
color: pink; 
} 

Answer 1

,하지만 당신은 조사 할 수 있습니다 : 여기

코드입니다 @media. 모든 장치에서 작동하는 웹 사이트를 원할 때 Bootstrap이 원하는 것을 수행하지 못하면 보통 @media가 내 다음 단계입니다. 이 CSS로

Answer 2

당신이 어떤 폭으로 CSS를 변경할 수 있습니다 명령 :

//tablet 

@media only screen and (max-width:767px){ 

.prev, .next { 
top: 250px; 
width: auto; 
padding: 16px; 
margin-left: 200px; 

} 

} 

//phone 

@media only screen and (max-width:480px){ 

.prev, .next { 
top: 250px; 
width: auto; 
padding: 16px; 
margin-left: 100px; 

} 

} 

는 나도 몰라, 당신이 원하는 위치에 있지만, 거기 당신은 여백 왼쪽 패딩이든 또는 변경할 수 있습니다