Post by elli on Sept 24, 2009 17:50:18 GMT -8
Alright, this is the last thing I'll bother this board with. (At least for a while.) Promise. (: Just some quick CSS help.
This is a jQuery slideshow that I put together using a tutorial here. I've changed a lot of the CSS on it, and it's the way I want, but one thing I can't figure out is why the background is doubling itself for only a few pixels in everything but IE.
i36.tinypic.com/2yzk5zc.png
CSS:
Thanks in advance. I know I post looking for help here a lot, and it's probably getting annoying. =p
This is a jQuery slideshow that I put together using a tutorial here. I've changed a lot of the CSS on it, and it's the way I want, but one thing I can't figure out is why the background is doubling itself for only a few pixels in everything but IE.
i36.tinypic.com/2yzk5zc.png
CSS:
#slideshow { width: 702px; }
#slideshow ul {
margin: 0;
padding: 0;
list-style-type: none;
height: 1%; /* IE fix */
}
#slideshow ul:after {
content: ".";
clear: both;
display: block;
height: 0;
visibility: hidden;
}
#slideshow .slides {
background-image: url(images/content3bg.png);
background-repeat: repeat;
overflow: hidden;
}
#slideshow .slides li {
height: 250px;
background: transparent !important;
width: 702px;
text-align: center;
padding: 20px;
}
/* ---------------------------------------------------- */
/* SLIDESHOW > NAVIGATION
/* ---------------------------------------------------- */
#slideshow .slides-nav { position: absolute; top: 40px; left: 742px; float: right; width: 0; }
#slideshow .slides-nav li { padding: 7px; }
#slideshow .slides-nav li a {
display: inline;
color: #261d10;
font-size: 16px;
}
#slideshow .slides-nav li.on, #slideshow .slides-nav li.on a { color: #130e09; font-size: 20px; }
.js #slideshow .slides-nav li.on, .js #slideshow .slides-nav li.on a { padding: 5px 3px 5px 3px; background-image: url(images/content3bg.png); }
Thanks in advance. I know I post looking for help here a lot, and it's probably getting annoying. =p