On 6/13/12, Markus Ernst <derer...@gmx.ch> wrote:
> Hello
>
> I am not sure if this message has got through the technical problems, so
> I take the liberty to send it again - I apologize for the case it worked
> and just nobody had an answer.
>
> I have a form, which I put in a layout table:
>
> <table>
>    <tr>
>      <td colspan="2"><h2>First section of the form:</h2></td>
>    <tr>
>    <tr>
>      <td><label>Mylabel</label></td>
>      <td><input type="text"></td>
>    </tr>
>    ... (more label/input pairs) ....
>    <tr>
>      <td colspan="2"><h2>Other section, quite long title</h2></td>
>    </tr>
>    <tr>
>      <td><label>Otherlabel</label></td>
>      <td><input type="text"></td>
>    </tr>
>    ... (more label/input pairs) ....
> </table>
>
> In order to make it responsive, I changed it to <div>s, and applied CSS
> display:table-* declarations.
>
> <div>
>    <div>
>      <div class="colspan"><h2>First section of the form:</h2></div>
>    <div>
>    <div>
>      <div><label>Mylabel</label></div>
>      <div><input type="text"></div>
>    </div>
>    ... (more label/input pairs) ....
>    <div>
>      <div class="colspan"><h2>Other section, quite long title</h2></div>
>    </div>
>    <div>
>      <div><label>Otherlabel</label></div>
>      <div><input type="text"></div>
>    </div>
>    ... (more label/input pairs) ....
> </div>
>
> div { display:table }
> div div { display:table-row }
> div div div { display:table-cell }
>
> It works well, except that I can't get the elements with the section
> titles to span two rows - so the left column with the labels gets forced
> to the maximum width of the titles.
>
> I tried something like:
> div div div.colspan { display:block }
> Which did not seem to change anything.
>
> The only solution that comes to my mind is to separate the table into 2,
> and take the titles out of it. This means I will have to apply fixed
> widths to the left column's elements. Is there something better?
>
> Thanks for your comments!
> Markus
-----------------------------------
I've attached a screenshot of what I get with your table based code.
Is this how you want it to look? If not, can you explain better....not
sure what you mean by:  " works well, except that I can't get the
elements with the section titles to span two rows - so the left column
with the labels gets forced to the maximum width of the titles." or
attached a link or jpg of what you want it to look like.
Rod Castello

-----------------------------------

> ______________________________________________________________________
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to