html drop down with more than one line for each thing

[gameon]

Hi, I have two drop down lists next to each other.

The problem I have is that some of the elements are so long, they break my table.

It possible for wrapping/to have them going on more than one line?

Any help would be great,

M@)

 

[cian]

Hi,
I don't think, does smaller text make any difference?
Can you post the code?



É

http://www.endamcg.com/finland-gaa

 

[gameon]

Here's an example, I need this to wrap - so the drop down has a much smaller width..


----------------------------------------
<select name=&quot;Product&quot; SIZE=&quot;1&quot; ID=&quot;Product&quot; STYLE=&quot;font-family : Verdana, Arial, Helvetica, sans-serif; font-size : 8pt; color: ##464C5E; background-color:##ffffff;&quot;>
<option value=&quot;&quot;></OPTION>

<option value=&quot;a very long value a very long value a very long value&quot; selected>a very long value a very long value a very long value</OPTION>
</select>
-----------------------------------------

cheers M@

 

[Boomerang]

Try this. It sets the width at onmousedown:

<script language=&quot;javascript&quot;>
function changeWidth()
{
if (document.MyForm.selectboxname.style.width == '105px')
{
document.MyForm.selectboxname.style.width = '450px';
}
else
{
document.MyForm.selectboxname.style.width = '105px';
}

}
</script>

<form name=&quot;MyForm&quot;>
<SELECT style=&quot;width:105px&quot; onmousedown=&quot;changeWidth()&quot; name=&quot;selectboxname&quot; SIZE=&quot;1&quot;>
<OPTION value=&quot;short&quot;>short value</OPTION>
<OPTION value=&quot;long&quot; selected>a very long value a very long value a very long value</OPTION>
</SELECT><br><br>
<input type=&quot;submit&quot; value=&quot;go for it&quot; name=&quot;submit1&quot;>
</form>

Hope this helps,
Erik <!-- My sport: Boomerang throwing !!
This year I will participate at the World Championships in Germany. (

http://www.boomerang2002.com)

!! Many Happy Returns !! -->

 

[gameon]

Hi this is a cool work arround, but it would sill break the table when it stretched out...

Thanks for taking the time to help.

M@

 

[cian]

I didnt think it was possible any normal way and I couldnt find any info on that.

Erik, I was trying your js, but it only displays the long option, when I click it it just jumps between the different widths.


É

http://www.endamcg.com/finland-gaa

 

[gameon]

what about a java applet that would show the rest of the name like an alt tag...

 

[Boomerang]

haha, you are right CIAN

I just saw it too :-(.

This was my original code:
function changeWidth()
{
document.MyForm.selectboxname.style.width = 300;
}

function resetWidth()
{
document.MyForm.selectboxname.style.width = 105;
}

<SELECT style=&quot;width:105px&quot; onmousedown=&quot;changeWidth()&quot; onchange=&quot;resetWidth()&quot; name=&quot;selectboxname&quot; SIZE=&quot;1&quot;>


The original code works OK but the only disadvantage is that when you 2 times select the same option the width stays 300.

So I wanted to change the code quickly for gameon but didn't test it proper

Does anybody has a clue to avoid the 300 width on 2 times selecting the same option?

Erik <!-- My sport: Boomerang throwing !!
This year I will participate at the World Championships in Germany. (

http://www.boomerang2002.com)

!! Many Happy Returns !! -->

 

[SashiRaveendran]

This is a tough problem with no easy solution. One method may be to use a custom select box. One visitor asked whether he could put images in a select, any way someone replied with a url to a page where someone had created thier own select box. Well this select would be able to wrap the text onto a new line as it uses tables to make up the drop down list. This did look like a very neet select box and one that gameon may find useful:

http://webfx.eae.net/dhtml/select/jsGenerated.html

hope this helps