я слишком долго царапал мою голову из-за этого. Я хотел бы изменить ширину и высоту простой версии 1.7 слайдера. Я просмотрел раздел часто задаваемых вопросов этого сайта после исследований во многих других местах и всяких недоразумений.не получить решение. Пожалуйста, помогите.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Pilot project</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/easySlider1.7.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#slider").easySlider({
auto: true,
continuous: true,
numeric: true
});
});
</script>
<link href="pilotp.css" rel="stylesheet" type="text/css" media="screen"/>
<link href="v1.7.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div class="header">
<div class="menu">
<ul>
<li><a href="http://">Home</a></li>
<span>
<a href="http://">Web Hosting </a>
<a href="http://">Domain Registration </a>
</span>
</li>
<li><a href="http://">Consultancy</a>
<span>
<a href="http://">I.S Audit</a>
<a href="http://">Information Security </a>
</span>
</li>
<li>
<a href="http://">Career's</a>
</li>
<li>
<a href="http://">Contact Us</a>
</li>
<li>
<a href="http://">Testimonials</a>
</li>
</ul>
</div>
</div>
<div id="container">
<div class="slidercontainer" style="background-color:fuchsia;width:800px;height:300px"><!--Will hold the slider -->
<div id="content" style="background-color:yellow;width:800px; height:299px;">
<div id="slider" style="background-color:pink;width:800px;height:298px;">
<ul>
<li><a href="http://templatica.com/preview/30"><img src="images/01.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/7"><img src="images/02.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/25"><img src="images/03.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/26"><img src="images/04.jpg" alt="Css Template Preview" /></a></li>
<li><a href="http://templatica.com/preview/27"><img src="images/05.jpg" alt="Css Template Preview" /></a></li>
</ul>
</div>
</div>
</div>
</div>
</body>
</html>
это CSS
/* Easy Slider */
#slider ul, #slider li,
#slider2 ul, #slider2 li{
margin:0;
padding:0;
list-style:none;
}
#slider2{margin-top:1em;}
#slider ul li, #slider2 ul li{
/*
define width and height of list item (slide)
entire slider area will adjust according to the parameters provided here
*/
width:800px;
height:241px;
overflow:hidden;
}
#prevBtn, #nextBtn,
#slider1next, #slider1prev{
display:block;
width:30px;
height:77px;
position:absolute;
left:-30px;
top:71px;
z-index:1000;
}
#nextBtn, #slider1next{
left:696px;
}
#prevBtn a, #nextBtn a,
#slider1next a, #slider1prev a{
display:block;
position:relative;
width:30px;
height:77px;
background:url(../images/btn_prev.gif) no-repeat 0 0;
}
#nextBtn a, #slider1next a{
background:url(../images/btn_next.gif) no-repeat 0 0;
}
/* numeric controls */
ol#controls
{
height:28px;
margin-top:-20em;
margin-bottom:1em;
margin-right:0px;
margin-left:8px;
padding-top:0px;
padding-bottom:0px;
padding-left:0px;
padding-right:0px;
}
ol#controls li
{
margin:0 15px 0 0;
padding:0;
float:left;
list-style:none;
height:28px;
line-height:28px;
}
ol#controls li a
{
float:left;
height:28px;
line-height:28px;
border:1px solid #ccc;
background:#DAF3F8;
color:#555;
padding:0 10px;
text-decoration:none;
}
ol#controls li.current a
{
background:#5DC9E1;
color:#fff;
}
ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
/*just added */
ol#controls { margin: -30px 0 0 0 !important; }
/* // Easy Slider */