开发者

CSS on my mastr page: I just want to add wrap on picture [closed]

This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, visit the help center. Closed 11 years ago.

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;}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜