Full height div: make faux column have a fixed width

I have a layout like so:

<div class='foo'>
    <div class='b开发者_运维技巧ar'>
        <div class='baz'>
            Content stuff...<br/>
            Content stuff...<br/>
            Content stuff...<br/>
            Content stuff...<br/>
        </div>
    </div>
</div>

with CSS like so:

.foo{
    position:absolute;
    left:20px;
    top:20px;
}
.bar{
    width:0px;
    border-left:1px solid blue;
    border-right:1px solid yellow;
}
.baz{
    padding-left:35px;
    padding-right:27px;
}

... a pretty standard way to get a full height columns. But I also need bar to be a fixed width (in this case 0px). Is there any way to get the content div, baz, to have its old width (when bar had auto width), and still keep bar full height?

Using CSS alone, I don't think so; At least none I can't think of.

Why not set the width to auto in CSS, using jQuery you can set the width to a variable, and then you can set the width to 0px...

That way you've got a variable that you can set .baz to.

Am I making sense?