Question

I have 2 tag inside a td

<td>
<label>some text</label>
<input type="text"/>
</td>

My goal is to not have these 2 tags form 2 rows inside the <td>, and the input tag takes whatever space <label> tag left. How can I do that using CSS.

Thanks!

Answer 1

How about that – the only downside is, that it adds another <div>:

CSS

div.a {
    width:      500px;
    border:     1px solid red;
}

div.a > label {
    float:      left;
}

div.a > div {
    display:    block;
    overflow:   hidden;
    border:     1px solid green;
}

div.a > div > input {
    width:      100%;
}

HTML

<div class="a">
    <label>Some text</label>
    <div>
        <input type="text"/>
    </div> 
</div>

Demo

jsFiddle