jQuery Image Slider with Divs

so I'm working on this jQuery Image slider (w/carouFredSel) that will be 100% wide and display the previous and next image as well. I got a great example from this site: http://coolcarousels.frebsite.nl/c/2/. However, when I change the img tags to divs, it does not work. I'm not sure as to why it doesn't.

This is the code that I am using:

#wrapper {
    background-color: #fff;
    width: 100%;
    height: 450px;
    margin-top: -225px;
    overflow: hidden;
    position: absolute;
    top: 50%;
    left: 0;
}
#carousel img {
    display: block;
    float: left;
}
#prev, #next {
    background-color: rgba(255, 255, 255, 0.7);
    display: block;
    height: 450px;
    width: 50%;
    top: 0;
    position: absolute;
}
#prev:hover, #next:hover {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.8);
}
#prev {
    left: -495px;
}
#next {
    right: -495px;
}
#pager {
    margin-left: -470px;
    position: absolute;
    left: 50%;
    bottom: 10px;
}
#pager a {
    border: 2px solid #fff;
    border-radius: 10px;
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 0 5px 0 0;
}
#pager a:hover {
    background-color: rgba(255, 255, 255, 0.5);
}
#pager a span {
    display: none;
}
#pager a.selected {
    background-color: #fff;
}

<div id="wrapper">
    <div id="carousel">
        <div style="width: 990px; height: 450px; background-color: #F00;"></div>
        <div style="width: 990px; height: 450px; background-color: #F00;"></div>
        <div style="width: 990px; height: 450px; background-color: #F00;"></div>
        <div style="width: 990px; height: 450px; background-color: #F00;"></div>
        <div style="width: 990px; height: 450px; background-color: #F00;"></div>
    </div>
    <a href="#" id="prev" title="Show previous"> </a>
    <a href="#" id="next" title="Show next"> </a>
    <div id="pager"></div>
</div>

$(function() {
    $('#carousel').carouFredSel({
        width: '100%',
        items: {
            visible: 3,
            start: -1
        },
        scroll: {
            items: 1,
            duration: 1000,
            timeoutDuration: 3000
        },
        prev: '#prev',
        next: '#next',
        pagination: {
            container: '#pager',
            deviation: 1
        }
    });
});

Solution

Now I am Sure.This one worked! http://jsfiddle.net/vvdp39vk/4/

#carousel div{
display: block;
float: left;
}