left-right floats in banner panel

by audetwebdesign

HTML

<div class="wrap">
    <div class="left"></div>
    <div class="right"></div>
    <div class="inner">
        <p>Text goes here</p>
    </div>
</div>

CSS

.wrap {
    position:relative;
    width:100%;
    overflow: auto;
}
.wrap .left {
    background:url(http://placekitten.com/100/150) 0 0 no-repeat;
    width:25px;
    height:123px;
    float:left;
}
.wrap .inner {
    background: red url(http://placekitten.com/900/150) 0 0 no-repeat;
    height:123px;
    overflow: auto;
}
.wrap .right {
    background:url(http://placekitten.com/120/150) 0 0 no-repeat;
    width:25px;
    height:123px;
    float:right;    
}