html - Select Spills Over Display Table Cell Parent Container -
I can not think of a better title! I have a pseudo-table structure using the code
This is styled using the CSS ' display: table-cell
, as follows:
. Table {display: table; Width: 100%; Table-layout: Fixed; } .table-cell {display: table-cell; Padding: 1am; Width: 33%; Border: 1 px solid # f 60; }
The problem is that the selection spill on the parents' containers if the option
value is too long here is a bella:
I I can solve the spilling problem by removing table-layout: fixed
, but I need to have the same width of the column at 33%. How can I select a table-cell element?
edit
I apologize apologetically, I forgot to mention:
To capture the full width (100%), the select
element is required, and the cell is responsive; It is spread with viewport.
Adjust it to meet your needs (such as setting CSS externally Tag / id / class):
& gt; Choose style = "width: 150px;" & Gt;
Or if you want a dynamic width (see Modified Bela):
This will force a closed list to render at a smaller size.
When opened, the browser will show a full, comprehensive list.
Note: Specifically (especially the older version) will not extend the selection list content to show to all (for example it Will be cut) Before suggesting any hacks, which version of IE (s) does you want to support ?
Comments
Post a Comment