How to set fixed table border width for variable cells width

Question

I have several RadiobuttonLists and all the label texts for list items have different widths. E.g.

RadiobuttonList #1

(o) this is a really long label         [textbox]

(o) this is another really long label   [textbox]

RadiobuttonList #2

(o) short label   [textbox]

(o) short         [textbox]

As you can see, the textboxes naturally set their place within fixed position of longest label for each radiobuttonlist set. Which is what I want. (The radiobuttonlist and textboxes each sit in <td> in <tables>.)

However, I have a border around each tables on all 4 sides (so imagine the light blue background that sits under my examples above to be the border).

I need all the tables to be of same width i.e. 800px in width.

Since I do not know the width of the first 2 <td> how do I ensure they add up to 800px?

Any ideas?

lukeocom · Accepted Answer · 2013-04-02 01:51:55Z

2

You should be able to control this using simple css rules. You can set the table width to be 800px, then set the width of the input fields, and let the td's fill to their max width. have a look at this fiddle for an example.. http://jsfiddle.net/JLF2n/

table{width:500px;background-color:#0af;border:2px solid #00f;padding:4px;}

td{border:2px solid #0f0;background-color:#afa;}
td+td{border:2px solid #ff0;background-color:#cc0;width:100px;}
input{width:100px;}

hope this helps

answered Apr 2, 2013 at 1:51

lukeocom

3,2533 gold badges20 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to set fixed table border width for variable cells width

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related