CSS on my mastr page: I just want to add wrap on picture [closed]
I've created a package on my css so that I could call it on my master page. My problem is when I add picture on the package the picture is to big that it is cropped. Could you possibly tell me that code on wrapping it? So that I could use it on jCarousel?
#featured .sliderImages{
position:absolute;
left:30px;
text-align:center;
width:380px;
height:202px;
top:30px;
}
ul.slider-img-list{
width:380px;
margin: 0pt; padding: 0pt; position: relative; list-style-type: none; z-index:
1;
top: 1200px;
}
ul.slider-img-list li{
overflow: hidden; float: left; width: 380px; height: 202px; vertical-align:bottom;
}
a.package1{
width:270px;
height:1开发者_开发问答80px;
display:block;
background:url(images/slideleft-1.png) top left no-repeat;
margin:0 auto;
}
a.package2{
width:270px;
height:180px;
display:block;
background:url(images/slideleft-2.png) top left no-repeat;
margin:0 auto;
}
a.package3{
width:270px;
height:180px;
display:block;
background:url(images/slideleft-3.png) top left no-repeat;
margin:0 auto;
}
a.package4{
width:270px;
height:180px;
display:block;
background:url(images/slideleft-4.png) top left no-repeat;
margin:0 auto;
}
a.package5{
width:270px;
height:180px;
display:block;
background:url(images/slideleft-5.png) top left no-repeat;
margin:0 auto;
}
.sliderImages span, .arrows span{
display:none;
}
Your question is pretty hard to understand. But I think your saying that the images in your carousel are too big? Maybe try:
ul.slider-img-list li img{width:100%;}
Also you could probably tidy up that CSS like this:
#featured .sliderImages {
position:absolute;
left:30px;
text-align:center;
width:380px;
height:202px;
top:30px;
}
ul.slider-img-list {
width:380px;
margin: 0pt;
padding: 0pt;
position: relative;
list-style-type: none;
z-index:1;
top: 1200px;
}
ul.slider-img-list li {
overflow: hidden;
float: left;
width: 380px;
height: 202px;
vertical-align:bottom;
}
ul.slider-img-list li img{width:100%;}
ul.slider-img-list li a {
width:270px;
height:180px;
display:block;
margin:0 auto;
}
a.package1 {background:url(images/slideleft-1.png) top left no-repeat;}
a.package2 {background:url(images/slideleft-2.png) top left no-repeat;}
a.package3 {background:url(images/slideleft-3.png) top left no-repeat;}
a.package4 {background:url(images/slideleft-4.png) top left no-repeat;}
a.package5 {background:url(images/slideleft-5.png) top left no-repeat;}
.sliderImages span, .arrows span {display:none;}
精彩评论