Question

How to auto resize img group with browser change size?

I almost finish it in css, but now I can’t set overflow:hidden let the 5th or 6th.. picture hide.

(img from php)
(I will connect jQuery plugin scrolling-carousel.)

Any suggestion i’d really appreciate you taking the time.

Here is my http://jsfiddle.net/uSHbc/1/
HTML

<div class="conimgwrap2">
    <div class="conimgwrap">
        <div class="conimg">

            <div>
                <img src="http://fancyapps.com/fancybox/demo/2_s.jpg">
            </div>                
            <div>
                <img src="http://fancyapps.com/fancybox/demo/2_s.jpg">
            </div>
            <div>
                <img src="http://fancyapps.com/fancybox/demo/2_s.jpg">
            </div>                
            <div>
                <img src="http://fancyapps.com/fancybox/demo/2_s.jpg">
            </div>
            <div>
                <img src="http://fancyapps.com/fancybox/demo/2_s.jpg">
            </div>

        </div>
    </div>
</div>​

CSS

.conimgwrap2{
    position: relative;
    left: 50%;
    width: 50%;
}
.conimgwrap{
    position: absolute;
    width: 25%;
    height: 25%;
}

.conimg{
    max-width: 100%;
    max-height: 100%;
    background-color: yellow;
    display: inline;
    white-space: nowrap;
}

.conimg div{
    display: inline;
    white-space: nowrap;
}
.conimg img{
    max-width: 100%;
    max-height: 100%;
}​

Answer 1

inner-

display: inline;
max-width: _%;
max-height: 100%;

outer-

white-space: nowrap;
and position set learn how from http://www.alistapart.com/articles/conflictingabsolutepositions