CSS table. Expand the entire length input field without wrapping on a new line.

Question

I have a form with elements structured like this:

<div>
   <label>Name</label>
   <input type="text" name="name" />
</div>

<div>
   <label>Address</label>
   <input type="text" name="address" />
</div>

As I want it to look, the label is located next to the input field, and the input field expands to fit the entire container. If I set the manual width in the input field, in pixels, then not every box has the same length.

If I try to set the width to 100%, the input fields will be wrapped to a new line to expand the width.

How can I make labels (the width of which is a variable) be located to the left of the input fields and expand these input fields to match their div content?

Here is my current CSS:

#content form input
{
   border: none;
   height: 23px;
   position: relative;
   top: -1px;
   left: -5px;
   padding-top: 5px;
   text-indent: 10px;
   display: inline-block;
}  

#content form label
{
   background: #c6c9c0 url('../images/form-label-bg.jpg') no-repeat center right;
   height: 28px;
   line-height: 30px;
   display: inline-block;
   text-indent: 15px;
   padding-right: 25px;
   color: #6a6a6a;
   text-transform: uppercase;
   font-weight: bold;
   font-size: 8pt;
}

Answer 1

:

form div {
    display: table;
    width: 100%;
}
label,
input { 
    display: table-cell;
}
label{ 
    width: 200px;
}
input {
    width: 100%;
}

Answer 2

, , "" .

, . % px.