Member Avatar for brian.byrneX

Found a cool little tutorial for styling drop down menus using CSS. You can change everything about the box - border, font, background colour etc including the drop down arrow. Ive made a custom drop down arrow to suit the style of the site. It all works fine in Chrome, Safari and Firefox. On Opera the box style remains but the arrow reverts back to the default. I can live with this.

However are good ole friend Internet Explorer is the problem. It also reverts back to the default arrow but a portion of my custom built arrow is visible underneath the the default arrow.

Anyone any ideas on how I can fix this? Tested version is IE 9

Here's a link code & css: http://tinkerbin.com/mD2vfqLQ

And some screenshots of the different browsers: http://ScrnSht.com/sqrnlh

  • 2 Contributors
  • 1 Reply
  • 87 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by johny_mplayer
Member Avatar for johny_mplayer

Hi there brian.byrneX.
The styling of the default arrow depends on the kind of O.S you use. For example I tried your code in MacOS + Firefox and had the same problem that appears in IE.
So I searched about it and found that the best solution is to use jquery dropdown so I just give you the link.
http://www.dev4press.com/jgd/dropdown/

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.