css - 位置:固定、幅:自動

Question

柔軟な列と要素を組み合わせたレイアウトをしようとしていますposition:fixed。最初の列には a position: fixed menu、2番目の列にはコンテンツとテキストがあります。私はテキストがposition: fixedそうであってほしいと思っています。最後に動くのは適切なコンテンツだけです。問題はコンテンツの幅です。変更されるため、コンテンツの幅を自動にする必要がありますが、 と を組み合わせるwidth:autoと機能position:fixedしません。

私の説明は十分に明確ではないと思うので、ここにコードがあります：

HTML

<div class="pageWrap">
        <div class="colLeft">
            <nav>
                <ul>
                    <li>ELEMENT 1</li>
                    <li>ELEMENT 2</li>
                    <li>ELEMENT 3</li>
                </ul>
            </nav>
        </div>
        <div class="colContent">
            <div class="content">
<img width="300" height="200" alt="1" src="http://lorempixel.com/output/nightlife-q-g-300-200-4.jpg">

<img width="300" height="200" alt="1" src="http://lorempixel.com/output/nightlife-q-g-300-200-4.jpg">

<img width="300" height="200" alt="1" src="http://lorempixel.com/output/nightlife-q-g-300-200-4.jpg">
            </div>
            <aside>
                <p>Lorem ipsum dolor sit amet, consectetuer 
                adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. 
                Cum sociis natoque penatibus et magnis dis parturient 
                ridiculus mus. </p>        
            </aside>
        </div>
</div>

CSS

.pageWrap {
    width: 600px;
    height: 1000px;
    background-color: rgba(256, 0, 0, 0.5);
}

    .colLeft {
        width: 100px;
        float: left;

        height: 100px;
        background-color: rgba(0, 256, 0, 0.5);

    }
        nav{
            position:fixed;
            background-color: rgba(0, 256, 0, 0.5);
        }

    .colContent {
        width: 500px;

        float:left;
    }
        .content {
            float: left;
            width: auto;
        }
        aside {
            width: 200px;
            float:left;
            position:fixed;
        }

[これ（JSFiddle）[http://jsfiddle.net/frMxW/2/]が欲しいのですが、脇position:fixedに置いて、小さな画像を入れたい場合は脇に隙間なくコンテンツの横に置いてください

どうすればそれを行うことができますか？

どうもありがとうございました！

更新:私はこのアイデアを試しました: コンテンツと脇を に置くことはdisplay:inline-block、Chrome と Firefox で動作するようです (画像の幅を変更してもサイドはそこにとどまります)が、Opera では動作せず、試してみることができませんすなわち。これが私の試みです：http://jsfiddle.net/9uGw4/7/