CSS Form select problems

[NerdConcepts]

This is not a problem in Firefox, just IE.

 

I have a select box, dynamic from SQL, that isn't the problem. The width has to be 53px so only a employee's number shows up, the problem is when you actually click to display the whole select options, the width of the option display stays at 53px, so you cannot see the employee's name.

 

In firefox, when you click to display all the select options it automatically expands the display (not what has been selected, just the dropped down options) in it's full width, so you see their ID number and Name.

 

Just wondering if there is a fix to this problem.

 

Note sure if this helps any, here is the code.

 

echo '<select name="uid[]" style="width: 53px">';
echo '<option></option>';

$uiQ = mysql_query("SELECT user_id FROM market_users WHERE (mgt_code='{$wo['wo_mgtarea']}') ORDER BY mgt_code ASC");
while ($uiR = mysql_fetch_array($uiQ, MYSQL_NUM)) {
$queryN = mysql_query("SELECT user_name FROM users WHERE user_id='{$uiR[0]}' LIMIT 1");
$rowN = mysql_fetch_array($queryN, MYSQL_NUM);
if ($wo['user_id'] == $uiR[0]) {
	echo '<option value="' . $uiR[0] . '" selected="selected">(' . $uiR[0] . ') ' . $rowN[0] . '</option>';
} else {
	echo '<option value="' . $uiR[0] . '">(' . $uiR[0] . ') ' . $rowN[0] . '</option>';
}
}
echo '</select>';

[phpQuestioner]

 

One way to solve this issue is to change the font-size of the select menu's options. I think (now don't hold me to this; because there maybe another way to do this other than a dhtml select menu and if there is; I'm sure someone else on here will let you know); this is one of those browser based display issue that can not be change with CSS. I think IE strictly conforms the select menu's dropdown option uniformly with the CSS style outlined for the select element; as where FireFox understands this issue and overflows the dropdown menu based on the text length of the options. Again this is my hypotheis and I could be wrong and if I am; I know a couple people on this forum who would love to tell me I am.

 

If I were you; I would try to change the font-size and see if that helped and if it doesn't; look into "DHTML Select Menu". I have created them before for instances like this; only my reason was; so that I could completely customize a select menu to anyway I wanted it to look and it will display that way through-out a cross browser platform.

[NerdConcepts]

When I started looking at examples it seemed as though this was going to work...but I don't know enough about javascript to make it work. The issue is that there are upwards to 100 of those select boxes on each days page. What it does is you select the employee to assign to it, which you can whichever you want for whatever job you want and at the bottom you update with a form button. That data is put into an array with PHP and then moved to updating a database.

 

The problem I have is that the menu's expand the table and are limited to the table that the select is displayed in. Hmmm, not sure what to do here except make the data display on two rows but that just won't work. Instead of printing off 100 lines I would be printing off 200. Just not working how I imagined, lol.

 

If anyone else has any idea or whatever, please feel free to post.

 

http://rewerkd.net/display_issue.jpg

 

EDIT: uploaded an image of the issue, so it might help visually.