I'd like to preface this with the fact I am posting for the first time and am a totally noob to web design and this forum...
I am trying to setup a carousel gallery to display images and I'm utilizing the jQuery infinite carousel script to do so. I've noticed that my images seem to be shorter than the viewport window even though I believe I've set the dimensions to be the same. I've done some trial and error and believe it's a CSS setting I don't have correct, but I wouldn't be surprised if I'm way off.
As I mentioned, I've never posted here before so whatever you'd like for me to post, I will try and do in order to get beneficial feedback.
I haven't modified any of the original js (jquery.infinite-carousel.js). I have modified the .css file that I downloaded to be easier for me to understand.
Thanks for any kind of help.
#gallery{
width: 1200px;
overflow:hidden;
margin-left: auto;
margin-right: auto;
margin-top: 36px;
border-width: 0 2px 0 2px;
border-color: #666;
border-style: solid;
}
#gallery ul{
position: relative;
padding: 0;
margin-top: 0; //<------- adding this line fixed my problem
}
#gallery li{
width: 1200px;
height: 800px;
float: left;
list-style: none;
}
#prev, #next{
position: relative;
width: 400px;
float: left;
cursor: pointer;
font-family: 'Loved by the King', cursive;
font-size: 20px;
color: #88796a;
text-decoration: none;
}