Jump to content


Photo

Oversize select in feature box not working


  • Please log in to reply
3 replies to this topic

#1 randomdejyahoocom

randomdejyahoocom

    Member

  • Members
  • PipPip
  • 13 posts

Posted 02 October 2011 - 11:39 PM

I've put an oversize select/dropdown (about 300px) into one of my feature boxes, the leftmost one. It extends all the way through the leftmost box and about a third of the way into the center box, so that the down arrow is in the center box. Bad design, I know, but I can't get a max-width property to work cross-browser, you know how it is. The oversize dropdown is affected by a strange bug. When you try to click on the down arrow, you can't. You can click on the part of the select box that is /within/ the leftmost box, but not the part of the dropdown that extends into the center box. I can't figure out why this is, but some of my users who frequent the dropdown have notified me and I need to fix it somehow. Here's the page: http://tyndale.edu/students/#campus The affected dropdown is the "3. Course" one, but it's partially hidden by Javascript. Please click on "2. Department" dropdown first and choose the "ANTH" option to make it show up. I really appreciate all help on this! I need either a solution to make the down arrow work, OR a cross-browser max-width solution so that the dropdown will wrap into the leftmost box. Thanks! (If it helps, I'm using WHP3.1.5 and WP 3.0.5)

#2 Jenny

Jenny

    Advocate

  • Unicorn Store Dev

  • 2924 posts
  • LocationWV
  • Country: Country Flag

Posted 03 October 2011 - 02:09 AM

This is happening because the content within the drop down box is wider than the box width. To fix this, why not make the boxes row only include two boxes and put the other box's info somewhere else?

#3 randomdejyahoocom

randomdejyahoocom

    Member

  • Members
  • PipPip
  • 13 posts

Posted 04 October 2011 - 01:09 AM

I tested your idea by removing the Account box to give more room to the Online Campus box. Unfortunately, the Email box slid to the left and I was stuck again. So I rearranged all three boxes to put Online Campus on the far right. And now the select box, which extends /over/ the context area into the gray matter, works! So... your idea didn't work, but it did give me a better idea. Thanks. :) Just curious, though: do you know why the select wouldn't work in the leftmost area? Why would the arrow work if it's in the gray matter, but not if it's in the next feature box?

#4 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 04 October 2011 - 02:13 AM

Maybe there was an invisible element blocking it (perhaps a DIV that was transparent and overlapping).