ブラウザウィンドウでウェブページを拡大する

Question

ブラウザウィンドウでウェブページのコンテンツを適切に拡大します。ウィンドウサイズを変更すると、タイトルは左に移動しますが、次のウィンドウと前のウィンドウは、テキストを中心に のままではなく、Webページの中央にとどまります。

<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。あなたがすべてのデバイスで動作するウェブサイトを望んでいて、ブートストラップがあなたの望むことをしないときは、通常は@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; 

} 

} 

は、私にはわからない、あなたが望む位置が、そこには余白左パディングまたは何かを変更することができます