Edit Question - KnowledgeHub

Title Body

I have 2 nested divs inside outer one, which has width:100%. Both nested divs should be in one line and first should get it size from it's contents: <div id="#outer" style="width:100%; border:1px"> <div id="#inner1" style="border:1px; display:inline"> inner div 1. Some text... </div> <div id="#inner2" style="width:100%????; border:1px; display:inline"> inner div 2... </div> </div> Question is how to make #inner2 div to get rest of the horizontal space if width of the #inner1 div is not specified and depends on what it is inside? P.S. All styles are in separate classes in my case, here I putted CSS into style attributes just for simplification. I want result to work in IE7+ and FF 3.6 In more details for me it looks like this: <style type="text/css"> .captionText { float:left; } .captionLine { height: 1px; background-color:black; margin: 0px; margin-left: 5px; margin-top: 5px; border: 0px; padding: 0px; padding-top: 1px; } </style> <table style="width:300px;"> <caption width="100%"> <div class="captionText">Some text</div> <div class="captionLine"> </div> </caption> <tr> <td>something</td> </tr> </table> Here is the image of what I want:

Tags (comma-separated) Cancel