私は自分の CMS として wordpress を使用しており、自分で選んだテーマを使用しています。テーマはホームページにスライダー (カルーセル) を表示しますが、スペースを取りすぎます。幅と高さを 80% に編集しようとしましたが、UI がおかしくなりました。スライダーが中央にない、または左右矢印の枠が近くなる。イメージがぶれます。これにはcssを正しく取得する必要があります。
私は次のことを試しました
- 幅と高さを 80% に変更
- px値を減らし、さらに台無しにしました
以下に、コードの関連する css および html 部分を示します。
<div id="slides">
<div class="slides_container slide" style="overflow: hidden; position: relative; display: block;">
<div class="slides_control" style="position: relative; width: 2736px; height: 480px; left: -912px;"><div style="position: absolute; top: 0px; left: 912px; z-index: 5;">
<a href=""><img src="http://localhost/taxeeta/wp-content/uploads/2013/01/116.png?1358343444279" alt=""></a>
</div>
<div style="position: absolute; top: 0px; left: 912px; z-index: 0; display: none;">
<a href=""><img src="http://localhost/taxeeta/wp-content/uploads/2013/01/215.png" alt=""></a>
</div>
</div>
</div>
CSS:
#slides {
position: absolute;
top: 15px;
left: 0px;
z-index: 100;
width: 897px;
margin-left: 14px;
}
.slides_container {
width: 912px;
margin: 0;
padding: 0;
}
.slides_control {
position: absolute;
top: 15px;
left: 0px;
z-index: 100;
width: 897px;
margin-left: 14px;
}