•
•
•
•
What is DaniWeb IT Discussion Community?
You're currently browsing the HTML and CSS section within the Web Development category of DaniWeb, a massive community of 425,998 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 1,697 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our HTML and CSS advertiser: Lunarpages Web Hosting
Views: 16877 | Replies: 21
 |
•
•
Join Date: Oct 2004
Posts: 16
Reputation: 
Rep Power: 5
Solved Threads: 0
Newbie Poster
Select tag, making dropdown larger than tag Hi, My select box contains some very large text values.
eg:
i need to make the selectbox size 100px, whereas, in the drop down, i need to show the full text of all the options
select size = say 100 px
dropdown size= say 500 px
How can i do this??
eg:
<select name=mytext> <option name=one value=one> one </option> <option name=two value=two> a very very huge option that cannot be accomodated</option> <option name=three value=three selected> three </option> <option name=four value=four> four </option> </select>
i need to make the selectbox size 100px, whereas, in the drop down, i need to show the full text of all the options
select size = say 100 px
dropdown size= say 500 px
How can i do this??
•
•
Join Date: Dec 2004
Posts: 1,590
Reputation:
Rep Power: 7
Solved Threads: 35
I don't understand at all. The "select" is used to place one of the drop-down values into the "textbox" portion of the element. So, almost by definition, the box has to be large enough to contain all of its possible values.
I think what you really what is an "unordered list", the
I think what you really what is an "unordered list", the
<ul><li> elements. •
•
Join Date: Oct 2004
Posts: 16
Reputation:
Rep Power: 5
Solved Threads: 0
Newbie Poster
•
•
•
•
Originally Posted by tgreer
I don't understand at all. The "select" is used to place one of the drop-down values into the "textbox" portion of the element. So, almost by definition, the box has to be large enough to contain all of its possible values.
I think what you really what is an "unordered list", the<ul><li>elements.
no dude. i have a select tag, i just wanna make the dropdown larger, as we do in vb, u can set the dropdown size and the select tag separately.
i want the cusomer names to be displayed completely in the dropdown
•
•
Join Date: Dec 2004
Posts: 1,590
Reputation:
Rep Power: 7
Solved Threads: 35
well like, dude, u no, it's kewl, watever u wanna du
That is so annoying! When did the English "I" and "you" become "i" and "u"? "Wanna" isn't a word once you're past the age of about 3. I'm so tired of responding to posts full of what amounts to baby talk. And I don't work on a ranch, so please don't call me "dude".
Which browser are you using? Both FireFox and IE will expand the size of the "select" to match the longest "option", by default. So, I'm not sure how you generated that screenshot.
However, you can style the
[html]
<select style="width:250px;">
<option>short option</option>
<option>A much longer option which will be truncated in the 'select' because the select is styled to 250pixels</option>
</select>
[/html]
That is so annoying! When did the English "I" and "you" become "i" and "u"? "Wanna" isn't a word once you're past the age of about 3. I'm so tired of responding to posts full of what amounts to baby talk. And I don't work on a ranch, so please don't call me "dude".
Which browser are you using? Both FireFox and IE will expand the size of the "select" to match the longest "option", by default. So, I'm not sure how you generated that screenshot.
However, you can style the
select to make it any size you like. Simply add a CSS style attribute to the select tag:[html]
<select style="width:250px;">
<option>short option</option>
<option>A much longer option which will be truncated in the 'select' because the select is styled to 250pixels</option>
</select>
[/html]
•
•
Join Date: Oct 2004
Posts: 16
Reputation:
Rep Power: 5
Solved Threads: 0
Newbie Poster
Well I thought you were a cowboy. I know that you can set the width = 250px. Thatz what i did to get the screenshot. but i need to make only the dropdown larger, and not truncate it to 250 px.
I may have a language problem, but atleast i dont have a comprehension problem.
I need to show the customer names completely. If you want i'll post the VB code to do that as well.
I may have a language problem, but atleast i dont have a comprehension problem.
I need to show the customer names completely. If you want i'll post the VB code to do that as well.
•
•
Join Date: Dec 2004
Posts: 1,590
Reputation:
Rep Power: 7
Solved Threads: 35
I'm willing to admit I have a comprehension problem. Since the dropdownlist automatically expands, in both IE and FF, to the length of the longest value, I do not comprehend how you're having a problem.
The VB code wouldn't help, since we're discussing a web application, correct? VB isn't a web development language, so how it builds dropdownlists isn't relevant. You can post your HTML, but that won't help much either: I know how HTML behaves.
You haven't answered some initial questions, such as "what browser are you using", so I doubt I can help you further.
The VB code wouldn't help, since we're discussing a web application, correct? VB isn't a web development language, so how it builds dropdownlists isn't relevant. You can post your HTML, but that won't help much either: I know how HTML behaves.
You haven't answered some initial questions, such as "what browser are you using", so I doubt I can help you further.
•
•
Join Date: Nov 2006
Posts: 3
Reputation:
Rep Power: 0
Solved Threads: 0
Newbie Poster
Well, I understand what plasmafire means because I got the same problem 
Let me explain it more clearly.
First, the answer is YES that in IE and FF, the width of drop down list will expand to the length of the longest value. But sometimes (in my case and plasmafire's), you do not have enough space for that expansion. So you have to narrow it down, and then the problem occurs...
Second, the answer is YES again for using style={width
XXpx} in my case and plasmafire's. It does narrow the drop down list as we want, but it also truncates the value texts in IE as you can see in the screenshot of plasmafire when you select the dropdown. It will automatically expand to have all texts visible in FF, but again not in IE.
I hope that I am clear enough. So my question is if there is anyway that we can make IE behaves like FF in this case. It means the size of dropdownlist is determined by us (through setting style), but the dropdown size will be the length of the longest value.
Thanks in advance for any helps.
Let me explain it more clearly.
First, the answer is YES that in IE and FF, the width of drop down list will expand to the length of the longest value. But sometimes (in my case and plasmafire's), you do not have enough space for that expansion. So you have to narrow it down, and then the problem occurs...
Second, the answer is YES again for using style={width
XXpx} in my case and plasmafire's. It does narrow the drop down list as we want, but it also truncates the value texts in IE as you can see in the screenshot of plasmafire when you select the dropdown. It will automatically expand to have all texts visible in FF, but again not in IE.I hope that I am clear enough. So my question is if there is anyway that we can make IE behaves like FF in this case. It means the size of dropdownlist is determined by us (through setting style), but the dropdown size will be the length of the longest value.
Thanks in advance for any helps.
•
•
Join Date: Oct 2006
Location: Sofia, Bulgaria
Posts: 135
Reputation:
Rep Power: 2
Solved Threads: 7
Junior Poster
•
•
•
•
Originally Posted by oyster163 
Well, I understand what plasmafire means because I got the same problem
Let me explain it more clearly.
First, the answer is YES that in IE and FF, the width of drop down list will expand to the length of the longest value. But sometimes (in my case and plasmafire's), you do not have enough space for that expansion. So you have to narrow it down, and then the problem occurs...
Second, the answer is YES again for using style={width
I hope that I am clear enough. So my question is if there is anyway that we can make IE behaves like FF in this case. It means the size of dropdownlist is determined by us (through setting style), but the dropdown size will be the length of the longest value.
Thanks in advance for any helps.
Hi there, I understand what you mean.
I don't know how it will work in plasmafire, however you can try to set a css rule like this, so I hope it works for you:
1. Lets say you set your select as id="myselect"
css:
#myselect {width: 100px;}
2. then you try to control the option element for this select defining the following css rule:
#myselect option{ width: 500px;}
have not tried it, however hope it works in plasmafire...
Good luck
p.s. I don't know if it will corectly validate in css validators
•
•
Join Date: Nov 2006
Posts: 3
Reputation:
Rep Power: 0
Solved Threads: 0
Newbie Poster
Hi Rhyan,
Thank you for your reply. I tried your codes. Again, it works perfectly (at least as we expected with the width of select and option tags) in FF, but not in IE...
IE... a real trouble...
Thank you for your reply. I tried your codes. Again, it works perfectly (at least as we expected with the width of select and option tags) in FF, but not in IE...
IE... a real trouble...
•
•
Join Date: Oct 2006
Location: Sofia, Bulgaria
Posts: 135
Reputation:
Rep Power: 2
Solved Threads: 7
Junior Poster
Well,
I tried it myself - indeed IE is wrong. Tried in FF and Opera - both read it right, still IE does not. Obvioursly the child element <option> inherits parent's setting. No idea how to make it work, sorry.
By the way, sorry for misunderstanding, obvioursly did not read carefully, however I thought plasmafire is a new browser
My bad, I must admit.
I tried it myself - indeed IE is wrong. Tried in FF and Opera - both read it right, still IE does not. Obvioursly the child element <option> inherits parent's setting. No idea how to make it work, sorry.
By the way, sorry for misunderstanding, obvioursly did not read carefully, however I thought plasmafire is a new browser
My bad, I must admit.
|
•
•
•
•
•
•
•
•
DaniWeb HTML and CSS Marketplace
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
Linear Mode
- Previous Thread: The name for the Resize Button to ad to Script
- Next Thread: Custom Styled Numbered Bullets
