Select dropdown with fixed width cutting off content in IE

by

For IE 8 there is a simple pure css-based solution:

select:focus {
    width: auto;
    position: relative;
}

(You need to set the position property, if the selectbox is child of a container with fixed width.)

Unfortunately IE 7 and less do not support the :focus selector.

Related Contents:

  1. How do I make a placeholder for a ‘select’ box?
  2. Hide scroll bar, but while still being able to scroll
  3. Tools to selectively Copy HTML+CSS+JS From A Specific Element of DOM [closed]
  4. How to remove the default arrow icon from a dropdown list (select element)?
  5. Remove the complete styling of an HTML button/submit
  6. css ‘pointer-events’ property alternative for IE
  7. Change select box option background color
  8. Remove Select arrow on IE
  9. Make multiple-select to adjust its height to fit options without scroll bar
  10. How to get equal width of input and select fields
  11. Div with horizontal scrolling only
  12. How do I get rid of an element’s offset using CSS?
  13. How can I limit table column width?
  14. How can change width of dropdown list?
  15. How to change color of disabled html controls in IE8 using css
  16. CSS-Only Scrollable Table with fixed headers [duplicate]
  17. absolute positioned anchor tag (with no text) not clickable in IE
  18. Internet Explorer 10 Windows 8 Remove Text Input and Password Action Icons
  19. SVG with width/height doesn’t scale on IE9/10/11
  20. Why does IE make password boxes smaller than text boxes?
  21. Gradient colors in Internet Explorer
  22. Input boxes with transparent background are not clickable in IE8
  23. Div 100% height works on Firefox but not in IE
  24. IFrame background transparent in IE
  25. How to vertically center a container in Bootstrap?
  26. How to center an iframe horizontally?
  27. Prevent line-break of span element [duplicate]
  28. Why are my CSS3 media queries not working on mobile devices?
  29. How do I remove the blue styling of telephone numbers on iPhone/iOS?
  30. Position: absolute and parent height?
  31. Make grid container fill columns not rows
  32. How to align entire html body to the center?
  33. Unicode character as bullet for list-item in CSS
  34. Understanding the grid classes ( col-sm-# and col-lg-# ) in Bootstrap 3
  35. angular/material2 mat-spinner resize
  36. How to keep footer at bottom of screen [duplicate]
  37. How to always show the vertical scrollbar in a browser?
  38. Blurry downscaled images in Chrome
  39. How to make div’s percentage width relative to parent div and not viewport
  40. Selectable in HTML tag
  41. Making a piece of text non-breaking?
  42. How to put two divs side by side
  43. How can I create a marquee effect?
  44. overflow: hidden; doesn’t work on Chrome with IFRAMEs?
  45. How to center multiple divs inside a container in CSS
  46. Can I ignore some website element when navigating using the tab key?
  47. Textfield with only bottom border [closed]
  48. Developer oriented CSS/HTML tutorial/book [closed]
  49. Setting overflow-y causes overflow-x to change as well [duplicate]
  50. How to add html special character (right-arrow) using content property of css? [duplicate]

Leave a Comment