Q:

Make parent div with absolute position take the width of children divs

I have the following html structure:
<div class="parent">
    <div class="child1"></div>
    <div class="child2"></div>
</div>

The parent is positioned absolutely, child1 and child2 are displayed side-by-side using inline-block.
I need this whole thing to be responsive based on the width of the 2 children divs. the problem is, if I increase the width of any of them, the parent's width remains the same. Changing its position to relative fixes this, but I have to have it in absolute.
Is there anyway to get it to be responsive?
EDIT:
I was hoping for this to be simple, but apparently not so much... :(
here's the actual HTML:
<div class="action_container">
    <div class="action_inner">
        <div class="action_title">Format Text</div>
        <div class="action_body">
            <div class="action_args_section"></div>
            <div class="action_output_section"></div>
        </div>
    </div>
</div>

And the CSS:
<style>
    .action_container {
        display: block;
        position: absolute;
    }

    .action_inner {
        border: 1px solid black;
    }

    .action_inner {
        min-width: 120px;
        min-height: 50px;
        background-color: white;
        border: 1px solid #666;
        border-radius: 5px;
    }

    .action_title {
        font-size: 12px;
        font-weight: bold;
        text-align: center;
        border-bottom: 1px solid #ccc;
        padding: 3px;
    }

    .action_args_section {
        display: inline-block;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        padding: 3px;
    }

    .action_output_section {
        display: inline-block;
        width: 50px;
        vertical-align: top;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        padding: 3px;
   }
</style>

A:

.parent{

  position: absolute;
  display: table;

}

.child{

  position: relative;
  display: table-cell;

}

Use this trick to set children in single line and parent to get width from them. Don't apply floats to nothing. And remember about white-space: nowrap; if You need to keep single line in child elements.
Here is fiddle.

A:

.parent {
    position:absolute;
    height:50px;
    border:1px solid red;
}
.child1 {
    width:100px;
    height:30px;
    border:1px solid green;
}
.child2 {
    width:150px;
    height:30px;
    border:1px solid blue;
}
<div class="parent">
    <div class="child1"></div>
    <div class="child2"></div>
</div>

Is this what you're looking for?
JSFiddle

