32

I'm experiencing quite an odd issue with <select> menus. When I go back to a page containing a <select> after I have clicked out of it (or minimized it) the <select> sometimes collapses and becomes unresponsive. I have checked all of my code, and it is 100% valid, further I have seen this happen on other sites as well.

I have experienced <select> menus collapsing in the latest version of Safari (available for OSX 10.6.8) as well as the latest versions of Chrome and Firefox (tested both on Windows Vista and OSX 10.6.8). Oddly enough I have not been able to reproduce the <select> collapse in Chrome running on Windows 8... One last tidbit: it seems that the length of the <select> element affects the probability of the menu collapsing (that is to say, the more <option> elements in a <select>, the more likely it is to collapse. Sometimes a <select> menu will collapse after being selected and clicked out of once, sometimes it can take 5 or 6 attempts.

My question is: What causes this <select> collapse issue, and is there a known work around? Please see the example code below, it's very simple, but the <select> menu has nonetheless collapsed in the browsers/operating systems I mentioned earlier. Thanks in advance!

<!doctype html>
<html>
<head>
  <title>Select Test</title>
</head>

<body>
 <select name ="Test">
  <option value = "0">0</option>
  <option value = "1">1</option>
  <option value = "2">2</option>
  <option value = "3">3</option>
  <option value = "4">4</option>
  <option value = "5">5</option>
  <option value = "6">6</option>
  <option value = "7">7</option>
  <option value = "8">8</option>
  <option value = "9">9</option>
  <option value = "10">10</option>
  <option value = "11">11</option>
  <option value = "12">12</option>
  <option value = "13">13</option>
  <option value = "14">14</option>
  <option value = "15">15</option>
  <option value = "16">16</option>
  <option value = "17">17</option>
  <option value = "18">18</option>
  <option value = "19">19</option>
  <option value = "20">20</option>
  <option value = "21">21</option>
  <option value = "22">22</option>
  <option value = "23">23</option>
  <option value = "24">24</option>
  <option value = "25">25</option>
  <option value = "26">26</option>
  <option value = "27">27</option>
  <option value = "28">28</option>
  <option value = "29">29</option>
  <option value = "30">30</option>
  <option value = "31">31</option>
  <option value = "32">32</option>
  <option value = "33">33</option>
  <option value = "34">34</option>
  <option value = "35">35</option>
  <option value = "36">36</option>
  <option value = "37">37</option>
  <option value = "38">38</option>
  <option value = "39">39</option>
  <option value = "40">40</option>
  <option value = "41">41</option>
  <option value = "42">42</option>
  <option value = "43">43</option>
  <option value = "44">44</option>
  <option value = "45">45</option>
  <option value = "46">46</option>
  <option value = "47">47</option>
  <option value = "48">48</option>
  <option value = "49">49</option>
  <option value = "50">50</option>
  <option value = "51">51</option>
  <option value = "52">52</option>
  <option value = "53">53</option>
  <option value = "54">54</option>
  <option value = "55">55</option>
  <option value = "56">56</option>
  <option value = "57">57</option>
  <option value = "58">58</option>
  <option value = "59">59</option>
  <option value = "60">60</option>
  <option value = "61">61</option>
  <option value = "62">62</option>
  <option value = "63">63</option>
  <option value = "64">64</option>
  <option value = "65">65</option>
  <option value = "66">66</option>
  <option value = "67">67</option>
  <option value = "68">68</option>
  <option value = "69">69</option>
  <option value = "70">70</option>
  <option value = "71">71</option>
  <option value = "72">72</option>
  <option value = "73">73</option>
  <option value = "74">74</option>
  <option value = "75">75</option>
 </select>
 </body>
</html>

Update: Here is a screenshot of a collapsed/unresponsive <select> menu in Safari 5.1.9 running on OSX 10.6.8 (this is a different mac than the one I was using earlier). It became unresponsive after 3 attempts (selecting an option, then clicking out of the browser). It does not reveal the option list when clicked, and is completely unresponsive until the page is reloaded. I'll be downloading chrome on the mac shortly.

Screenshot

Update 2: According to @webdad3, this issue is also present in IE9

Update 3:

Here is a link to the source code I posted above, but in JSbin. Courtesy of @starbeamrainbowlabs.

http://jsbin.com/eXOMeRI/1/edit

Update 4:

According to @Zarazthuztra, this issue is also present in OSX 10.8.

Update 5:

I'm taking @cloudcoder2000's advice and posting this link in the question itself. I believe it shows that a <select> should not collapse (like many of us are experiencing) regardless of the number of <option>s it contains.

Is there a max number of options (values) in HTML drop down control?

I would like to also thank everyone for their help thus far.

Update 6: I fear this question is beginning to stagnate... If anyone has any theories as to what is causing this issue (regardless of how "off-the-wall" it may seem) let me know and I'll test it asap.

Update 7: Just confirm: I've experienced this collapse issue on several pages that do not use Javascript. Further, the example code I posted above (which does not contain any Javascript) has collapsed for me and a few other stackoverflow users (across different operating systems and browsers).

Update 8:

@Capile was able to reproduce the collapse issue in Safari 7.0.1 running on Mac OS X 10.9.1.

Update 9: By using @Capile's code, I was able to get the <select> to "uncollapse" in Safari 5.1.10 (running on OSX 10.6.8). Please read his answer for the full details. I will be testing his code in Chrome and Firefox later today, or tomorrow. This is really promising, I think we're getting close to solving this. I would just like to thank everyone again for their help thus far, you guys are great!

Update 10: I finally got a chance to test @Capile's code in Chrome on one of my Snow Leopard (10.6.9) machines. I had quite a bit of trouble getting the <select> to collapse this time, but after a few minutes of trying, it finally did. After pasting his code into the console the <select> "uncollapsed" (to put it as inelegantly as possible). This is quite curious, because if this "collapse" issue is related to system-level garbage collection, then one would think that the a <select> would "collapse" fairly consistently across browsers, but this isn't the case. I've tested a myriad of browsers (across multiple operating systems) and <select> "collapse" seems exceedingly common in certain browsers (such as Safari)... I'm admittedly not an expert programmer so I may be wrong, but in any case, I just wanted to update this question so that greater minds could mull over the new information.

Update 11: I just added a bounty to this question in an attempt to generate more interest (I hope it helps). Anyway, I was able to get the <select> to collapse in the latest version Firefox (running on OSX 10.6.9) last night. I unfortunately did not get a chance to test @Capile's code in Firefox, but I will try to do so today.

Community
  • 1
  • 1
Elle
  • 601
  • 5
  • 18
  • 2
    Hm, @user2569147, I've played around with this in Chrome 31.0.1650.63 in Linux 12.10 and can't seem to reproduce the error. Maybe try updating your browser, though I'm not sure that would help. – Atutouato Dec 31 '13 at 16:04
  • 1
    It could be lag, but other than that I can't think of what it could be - I can't reproduce either. Do you have any extensions that could be interfering? Here is the above in a jsbin: http://jsbin.com/eXOMeRI/1/edit – starbeamrainbowlabs Dec 31 '13 at 16:34
  • @Atutouato, thanks for the comment. I just double checked Chrome on all of my computers and they're all up to date. Did you try selecting an option from the menu before clicking out of the browser? Thanks again! – Elle Dec 31 '13 at 16:34
  • All I see is `` `` `` ` – bjb568 Dec 31 '13 at 16:57
  • Hi @starbeamrainbowlabs (great name by the way), on the mac I tested yesterday, I had a page load timer extension, but I didn't have any extensions installed on the Vista computer. It's a very odd and inconsistent issue... I have absolutely no idea what could be causing this, that's why I deferring to the great minds at Stackoverflow! Thanks for the comment! – Elle Dec 31 '13 at 16:59
  • @Dude, are you referring to my post on stackoverflow? It seems to be displaying correctly for me... – Elle Dec 31 '13 at 17:04
  • 1
    With @Atutouato jsbin example I was able to reproduce your issue in IE9 – webdad3 Dec 31 '13 at 17:07
  • That's fantastic @webdad3! I guess I'm not crazy. :) This is a super odd issue... – Elle Dec 31 '13 at 17:09
  • Nope you aren't crazy.... That is wierd... Needless to say it shouldn't work like that :) – webdad3 Dec 31 '13 at 17:11
  • @webdad3, I know, I only noticed this issue recently and it's been absolutely maddening. May I ask what operating system you were using? – Elle Dec 31 '13 at 17:15
  • @user2569147, I'll try it again with your suggestion. – Atutouato Dec 31 '13 at 17:27
  • Hm. No dice. Must not be an issue on Linux or something like that. Tried it about 10 times, but it didn't freeze at all. – Atutouato Dec 31 '13 at 17:30
  • @Atutouato, Hmm... That is really weird. Thanks for trying though! – Elle Dec 31 '13 at 17:34
  • @user2569147 Yeah. I am repeating back all the highlighted part, emphasizing the repeated ` – bjb568 Dec 31 '13 at 17:46
  • @Dude, ok. Sorry if that annoyed you, I just wanted to make sure the post was clear and easy to read since one can "Select" a ` – Elle Dec 31 '13 at 17:49
  • 1
    I've actually ran into this issue as well. My only guess is that it's POTENTIALLY a flaw in the HTML5 implementations these browsers are using, since it appears only on newer versions and across OSs. Just a theory, but +1 anyway. – Zarathuztra Dec 31 '13 at 17:51
  • @Zarazthuztra, thanks for the comment! It would be interesting if the issue was only present when using the HTML 5 doctype. I think I'll test that but Firefox, IE, and Chrome all use different rendering engines, so this problem is quite confounding. – Elle Dec 31 '13 at 18:08
  • @user2569147 For sure, I'm glad I'm not the only one who hit this. I thought my Mac was just bugging out on me :) Keep plugging away! See if you can get it to happen in an older browser, something without HTML5 support. – Zarathuztra Dec 31 '13 at 18:19
  • For someone with such a studious question, I am suprised you manually created HTML for 75 numbered options... – dthree Dec 31 '13 at 18:43
  • @dc2. Haha, I generated it via a PHP loop. :) – Elle Dec 31 '13 at 18:46
  • Okay, I almost feel better :) still PHP makes me cringe, but we are getting on the right track! – dthree Dec 31 '13 at 18:50
  • By the way, you'll get more answers to your question if you abbreviate your question to exactly what is needed. Like maybe just show 2 or 3 of the options... – dthree Dec 31 '13 at 18:51
  • @dc2. Ha, I'm in the process of getting acquainted with Python, so don't feel too bad.:) – Elle Dec 31 '13 at 18:53
  • 1
    Okay, you are officially a good person. – dthree Dec 31 '13 at 18:56
  • @dc2. Thanks for the advise. Unfortunately the shorter the ` – Elle Dec 31 '13 at 18:57
  • Oh, I meant like this: ` ` Its all about presentation! – dthree Dec 31 '13 at 18:58
  • You could drop the value attribute, unless you need it(if submitting the data). That could make a difference, beyond that, it could just be lag from your device, it's fine for me. – Jack Dec 31 '13 at 22:00
  • @JackWilliams thanks for the comment. I believe you're the second person to suggest lag was the issue, the ` – Elle Dec 31 '13 at 22:11
  • @Jackwilliams. Would you mind telling me the operating system and browser you are using? Thanks! – Elle Dec 31 '13 at 22:12
  • Sure, WIN 7 with Latest Chrome. It was merely a suggestion, i mean your CPU sounds great but i guess you're using the integrated on-board graphics. Whereas i have a discrete AMD 7870 and Intel 2500K. But, as you said, it becomes completely un-responsive -- could be a matter of out-dated drivers? – Jack Dec 31 '13 at 23:08
  • @JackWilliams, Thanks again for your response. I actually have a 1gb AMD/ATI Radeon 5750 in the iMac which is a pretty decent card... I'll look into the drivers, but I have experienced this issue on multiple computers all with different operating systems. – Elle Jan 01 '14 at 00:25
  • 3
    Just for the record, I tested the fiddle on : Win7/IE11 Win7/FF XP/Opera XP/IE8 XP/FF XP/Safari XP/Chrome. Latest versions of all browsers (except IE8 of course); all XP versions running in a VirtualBox PC. I was not able to reproduce the problem. My video card is an nVidia GeForce 8800 and my CPU an I3-2100 @3.1 GHz – kuroi neko Jan 01 '14 at 00:39
  • @kuroineko. Wow, thanks so much! This really does not make any sense... Just on this thread we have had three people that have been able to reproduce the problem and three or four that haven't... Nonetheless, I really appreciate your help! – Elle Jan 01 '14 at 00:47
  • I can't solve this one for you, but a workaround to mitigate the behaviour might be to have a HTML 5 number input with max and min values, and a datalist of possible options which will mean it feels a bit like a select in browsers that support it. – pwdst Jan 01 '14 at 10:20
  • @pwdst. Thanks for the comment and advice! I'll definitely look into that if we aren't able to find out what is causing this collapse issue. Happy new year! – Elle Jan 01 '14 at 13:16
  • @Zarazthuztra and OP: Are you both on OSX 10.6.8? – Henry Blyth Jan 01 '14 at 14:52
  • @HenryBlyth, I have experienced this issue on both OSX 10.6.8 and Vista. Though, all of the macs I have tested thus far have been running 10.6.8. I have a mountain lion computer at my office, so I may go in later today if nobody else has tested it before then. – Elle Jan 01 '14 at 14:56
  • @HenryBlyth I experience this on my work machine which is 10.8 (not allowed to upgrade to 10.9 yet, blame the fact it's IBM) but on my home machines I'm on 10.9 and I haven't seen this issue...yet – Zarathuztra Jan 01 '14 at 15:09
  • @Zarazthuztra. Do you recall the specs of your work computer? Just thought I would ask since several people suggested that the issue could be caused by "lag". (Though I find that highly doubtful). – Elle Jan 01 '14 at 15:13
  • @dc2 Just now getting to read through all these comments and I saw you mentioning populating a large select list without a script to do it for you. Wanted to mention that I actually HAD to do this once (manually populate a large select list, no way around it, for a large client (under NDA so I can't say who they were, but I can say they are a large search company that wasn't google) – Zarathuztra Jan 01 '14 at 15:13
  • @user2569147 It's a early 2012 lower 27" iMac running 10.8. As far as lag goes, it's doubtful, and the reason I say that is because the browser window that the select box is actually in 1) It can happen to any box on the page, even those with about 4 options, and 2) The page itself consists of about 8 form fields, and literally nothing else. It's like 500x500 px – Zarathuztra Jan 01 '14 at 15:14
  • @dc2. Yeah, I really don't think it is at all lag related. I tested this collapse issue on my 12 core mac pro with 64gbs of ram. If that isn't enough to run safari, then I don't know what is. :) Admittedly though, when I was testing the collapse issue I was rendering something out (which was taking up 6 of my cores). I plan to test for the collapse again after a fresh reboot once the rendering is finished. – Elle Jan 01 '14 at 15:23
  • @user2569147 Off topic hardcore, but I'm drooling at your mac pro – Zarathuztra Jan 01 '14 at 15:32
  • 1
    @Zarazthuztra. Haha, thanks. :) It still isn't fast enough to edit 4k video in real time (at least reliably), so I've been drooling over the new mac pro with its dual fire graphics cards. That's off topic though as well. :) – Elle Jan 01 '14 at 15:37
  • Upvote for most friendly and helpful discussion I've seen on SO yet. Well done folks. – Zarathuztra Jan 01 '14 at 15:38
  • Kudos to @Zarazathuztra. (and I guess there's an exception to everything, right?) You work in IBM, eh? I've met some IBMers, like Jeff Jonas. – dthree Jan 01 '14 at 18:14
  • Hmm... To do a bounty or to not do a bounty that is the question... Does anybody with experience with bounties have any advice, is setting a bounty worth it? – Elle Jan 05 '14 at 14:33
  • Try to to delete the spaces in the HTML document. Run it through a minifier. (That sounds funny, but someone I can't remember actually faced such a strange bug in his Java application!) – ComFreek Jan 06 '14 at 15:34
  • @ComFreek. Thanks for the suggestion! I've already tried removing the spaces in the ` – Elle Jan 06 '14 at 16:31
  • @ComFreek. I minified and tested the ` – Elle Jan 06 '14 at 16:59
  • Hmm... Maybe I should have offered a larger bounty... – Elle Feb 14 '14 at 04:29
  • @Elle Have you been able to reproduce with a debugger open like FireBug? – Matthew Feb 17 '14 at 20:40
  • @Matthew. No, but I can try to later tonight. – Elle Feb 17 '14 at 23:06
  • Can you reproduce it with hardware acceleration off? Tools > Options > Advanced > General > Browsing: "Use hardware acceleration when available" – peterfoldi Feb 18 '14 at 11:57

7 Answers7

12

Since the <select> element UI is handled by the OS in several browsers (which makes their complete styling much more complicated, or impossible), I would guess that's it is a bug on OS level, or a bug at the browser that relates to some OS UI functionality — definitely not a problem of the source HTML, which is plain simple and according to specs).

For the browser, the <select> element is completely normal: you can see it at DOM, even manipulate it (it also listens to events as well). If you detach and reattach it to the DOM, it works normally again (open up and enable selecting). If you just run the code below at the console window, you'll get it working again:

var s=document.getElementsByTagName('select'),
    i=s.length,
    a=document.createElement('div'),
    b;
while(i-->0) {
    s[i].parentNode.insertBefore(a, s[i]);
    b=s[i].parentNode.removeChild(s[i]);
    a.parentNode.insertBefore(b,a);
    a.parentNode.removeChild(a);
    b=null;
}

My guess is that when the browser is blurred, the UI elements might get caught by some sort of OS garbage collector, and when you get back at the browser, it just expects the OS to display it again (but it can't find it). But it's just a guess — I'd need to profile Safari memory in order to really get to it.

I could replicate it on Safari 7.0.1 running on Mac OS X 10.9.1, but couldn't replicate it on Firefox 28.0a2 (Aurora) or Chrome 34 (Canary).

Capilé
  • 2,038
  • 17
  • 14
  • Thanks so much for the response @Capile! I won't be able to test your code until tomorrow, but this is very interesting. It actually never occurred to me to try removing and re-adding the ` – Elle Jan 30 '14 at 03:42
  • Hi @Capile, I just got a chance to test your code, and sure enough it worked! (At least when I tested it in Safari 5.1.10). I'll try to reproduce the collapse in Chrome and Firefox later today so that I can test your code in those browsers too, but nonetheless, thanks so much for your help! This is a massive clue! +1 – Elle Feb 04 '14 at 16:43
  • I just went ahead and awarded you the bounty since you provided a workaround. However, I would really like to understand the root cause of this collapse issue and for that reason, I'm not accepting this answer. Nonetheless, thanks for your help! – Elle Feb 19 '14 at 07:35
3

You have an issue not related to <select>.

Some if not most DHTML web-application logic not work well with "back" and "forward" buttons, these are almost are history.

The source code you provided is OK.

Update the browser or change it for another that is capable of the task. in your browser has any problem with plain select about 75 items - contact your browser provider.

The limitation for an amount of elements in select does exist as for everything. We are limited by amount of memory per app - depends on platform and amount of memory left. The browser has some internal collections of elements and these collections are limited to some quantities. The same goes for every application. Though these limits are far from barely hundred of items, the select may contain a lot more but it's an another pain to render them. In some intranet applications ppl use thousands of options per select and multiple selection of 75.

Check your JS instead, it's possible you have a script working on the select element that is causes it to misbehave.

UPD: might be a problem with

 <!doctype html>

it's ver 5 non-standard so far. 03.2014 (for more info take a look at http://www.w3.org/html/wg/drafts/html/master/)

try

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

to prevent a browser from trying to parse HTML ver 5.

  • Thanks for your response, but just to reiterate: This issue is present in multiple browsers across operating systems, and the problem still exists even if the page doesn't contain Javascript. – Elle Feb 18 '14 at 16:31
  • IMHO: There is NO problem with your "select". The only problem with HTML sample provided is DTD version 5 (it's not standard yet), if you remove it or replace with ver.4 -should work OK in any non HTML5 browser. – Konstantin Ivanov Mar 06 '14 at 07:44
  • Thanks @KonstantinIvanov! I was using Chrome and I tried on Firefox and I didn't have any issue. I upgraded my Chrome version and everything is fine now. – Papouche Guinslyzinho May 23 '21 at 00:50
2

As mentioned in the comments, this seems like lag. Whether it is caused by the specs of your computer, the browser, plugins/extensions, or something else on the page, you can't put 75 options in a select and expect Safari and IE to keep up. I'm not sure if lag could cause a page to freeze and force the user to reload it, but I honestly don't know what else could have caused it.

I'm not really sure where you would need a select with 75 options, but if you do really need it, I'd recommend a simple text input where you limit what the user can input to 1-75. Yes, it's not exactly as simple and elegant as a dropdown select, but it will get the job done, and you shouldn't have to worry about glitches.

hkk
  • 2,069
  • 1
  • 23
  • 48
  • 4
    Thanks for your response. I've seen quite a few (extremely) long drop down menus that work flawlessly (they are mostly "Choose Your Country" drop downs). I greatly appreciate your advice but this drop down collapse is possible even with 4 or 5 options (though, admittedly it's much less common). I would like to get to the bottom of this (if that is at all possible). Thanks again for the advice! – Elle Jan 01 '14 at 01:02
  • This is a fine guess and your point about usability is good (so I won't downvote it). However, 75 elements is trivial to a browser even on a slower device. There could definitely be a bug *related* to the number of items (e.g. IE9 has a terrible issue with ordered lists) but the root of the problem is probably not performance-related. @user2569147 - long shot, but remember that elements like `select` are often rendered in a shadow DOM. Might give you something to investigate further. FWIW I cannot reproduce your problem in Chrome or Safari on the PC. – Tim M. Jan 01 '14 at 03:51
  • @user2569147 If you're experiencing this bug with only 4 or 5 options, then there's definitely a problem with your browser/computer. Even in older browsers, `select` is quite a basic element that should be rendered flawlessly. If Safari couldn't handle drop downs with only 4 options (which are extremely common), even occasionally, I'm sure Apple would fix the bug right away. I know that this has been mention before, but make sure that there aren't any plugins, extensions, scripts, background applications, malware, or anything else that may cause this glitch. – hkk Jan 01 '14 at 05:53
  • @user2569147 I know this isn't a definitive answer, and isn't the "right" answer that gets to the bottom of this question, but unless you can find out what's going wrong, this will be your best bet. – hkk Jan 01 '14 at 05:54
  • @TimMedora You make a good point, but let me clarify what I meant by "you can't put 75 options in a select and expect Safari and IE to keep up." Browsers like IE and Safari, which are normally well behind the curve, often have glitches if you overload them. The problem isn't that having 75 options causes lag, but in IE/Safari there may be a glitch that causes it to lag, which is exacerbated by having 75 options. I apologize for not being clear enough, and I hope this helps clarify what I said. – hkk Jan 01 '14 at 06:00
  • @TimMedora. Thanks for the comment! I don't really care if something is a "long shot" every idea helps and gets us closer to the bottom of this. Thanks again! – Elle Jan 01 '14 at 13:21
  • @Cloudcoder2000. Thanks for the reply, I have experienced this issue on multiple computers and operating systems, I'll go through my computers today just to make sure, but I find it highly unlikely that this issue would be related to my computers themselves. (Though, one never knows). Just to be clear, others on the thread have experienced this problem, but nonetheless I'll go through everything just to make absolutely sure I'm not missing something obvious. Thanks again! – Elle Jan 01 '14 at 13:30
  • @Cloudcoder2000. I just wanted to let you know that thus far, I have basically had to _try_ in order to collapse a `` choose an ` – Elle Jan 01 '14 at 13:38
  • @Cloudcoder2000. One last thing, here is a link I came across last night and found very interesting. http://stackoverflow.com/questions/42763/is-there-a-max-number-of-options-values-in-html-drop-down-control – Elle Jan 01 '14 at 13:42
  • While I agree that lag COULD be a possibility, it takes little to no processing and rendering power to generate that field. Very simple to render, usually no styling, and javascript that fires typically on onchange. Especially if this happens on a variety of OSs, browsers, and hardware configs. – Zarathuztra Jan 01 '14 at 15:16
  • 1
    @user2569147 Thanks for the link. I think that it's so closely related to this question that you might as well provide a link to it in the question itself. Again, this answer was not a definitive answer, but just my best guess from what information we have, so take it with a grain of salt. I've been unable to reproduce the issue, but if it's happened on multiple computers, then, you're right- it's probably not something specifically related to the computer. – hkk Jan 01 '14 at 16:32
  • @Cloudcoder2000. I took your advice and posted the link in my question. I appreciate all of your help! – Elle Jan 01 '14 at 16:47
  • @user2569147 No problem. This is a great question, and I really want to get to the bottom of it. – hkk Jan 01 '14 at 16:48
1

Aaaahhhh, this is a longshot, but...

Try removing the spaces in your HTML attributes (not inside quotes), so value = "0" becomes value="0".

Henry Blyth
  • 1,700
  • 1
  • 15
  • 23
  • 6
    I'll test your idea just to be safe. However, if this is what's causing the collapse issue, I will need the contact info for both a neurologist and a good drywall repair person... – Elle Jan 01 '14 at 14:13
  • I just removed the spaces from the ` – Elle Jan 01 '14 at 14:35
  • 3
    @user2569147 In a weird way, I'm *so* glad that didn't solve it for you, because your head stays un-smashed-in! I would have done the same, too. Thank [insert deity/relative/pet/chocolate here] our heads are safe! But our sanity? Well... – Henry Blyth Jan 01 '14 at 14:47
  • Haha. This truly is a maddening issue. Thanks for the suggestion though and happy new year! – Elle Jan 01 '14 at 14:52
1

I've seen similar behaviour with the select element but it was usually not the cause of the problem. If the basic browser components are lagging then it's usually because there is a long running script in the background that is consuming all of the browser resources. Is the page you pasted above the entire page or is there also significant javascript being run on the page?

Lucas
  • 1,221
  • 9
  • 10
  • Thanks for the response @Lucas! The example code I posted in my question (which does not contain any Javascript) has collapsed for me when using several different browsers (though I have found that the issue is most prevalent when running Safari 5.1.9). I have updated my question to make this more clear. Thanks again! – Elle Jan 25 '14 at 02:11
1

Find the browser which works for you while waiting for an update/patch. Whenever I encounter a browser issue I usually switch between Firefox, Google Chrome, and IE.

As for your code, I suggest looking into JavaScript, which should make your life easier by turning all those hard-coded <option> into something dynamic. Something like:

// Starting from index 0, 
// create an <option> with the value of the current index
// keep creating <option> until you hit index 75.
Marlo C
  • 587
  • 3
  • 14
  • 26
-1

here your problem solution use javascript for print values in select tags like:

for(i=1969;i<=2014;i++) { document.write(''+i+''); }

V_Rajput
  • 21
  • 2
  • 6
    How would this help fix the problem? Both of these solutions seem to do the exact same thing, except moving the structure, which is normally kept inside the HTML, to the scripting languages, which is normally used to get/process data/add interactivity. If you've replicated the problem before (which I haven't been able to do) and this fixes it, then great, but I'd like to know why. I'm not really sure how this would help, as the resulting HTML is exactly the same. – hkk Jan 01 '14 at 06:24
  • Thanks for taking the time to try to help. However, I agree with @cloudcoder2000, I don't really see how this would solve the issue... Have you been able to replicate the problem? – Elle Jan 01 '14 at 13:46
  • I don't recommend manipulating – Zarathuztra Jan 01 '14 at 15:29
  • Now see the code and use this in b/w script tags. This would help you in your code. – V_Rajput Jan 06 '14 at 07:07