Okay, so there is no trick to actually compute these dimensions (except in IE).  However, there is a little known technique in CSS which is supported in all browsers and solves most of these problems.

Most usually, the desire to mix the two units comes about when one wants column A to fill the page except for column B, which has a fixed pixel width.  The problem becomes more formidable when doing the same thing with rows, the reason being that while a block element will naturally expand to fit its container’s width, there is no parallel behaviour for height.

The misconception: when positioning absolutely, two positions and two dimensions should be set.  I.E., top, left, width, height.

The truth: many combinations of position and dimension may be used.  Want to fill the page except for a 300px bar on the right?  Sure:

html, body {
    height: 100%;
}

#content {
    position:absolute;
    top:0;
    right:300px;
    bottom:0;
    left:0;
}

Turns out you don't even need to specify dimensions, they can be implied by positions. This is actually really old-school stuff which is supported by IE of old, back when it couldn't deal with flowing layouts very well. If you want to start combining percentages with pixels, just mess around with this technique and some containers.