Solved

background image for option selects

Posted on 2008-06-11
2
746 Views
Last Modified: 2012-05-05
Hello,

I need a background image for my option selects.

My code works in FireFox but not IE
<style>

option {

background: red url(http://www.gosmelltheflowers.com/blog/wp-content/uploads/2007/10/flowers.jpg) no-repeat scroll top left;

}

</style>
 

<select name="showpin[0]" id="showpin_0"  onchange="changePin(this);">

<option value="1">1</option>

<option value="2">2</option>

<option value="3">3</option>

<option value="4">4</option>

</select>

Open in new window

0
Comment
Question by:hankknight
  • 2
2 Comments
 
LVL 10

Accepted Solution

by:
bluefezteam earned 500 total points
ID: 21761645
With IE it will not show background images as part of a select form control. There is no workaround.

There is a way if you want to get into javascript, You could write a custom javascript selectbox using floating divs which updated the value of a hidden input field. However, your users could be rather screwed if they don't have scripting enabled (or the necessary scripting support) and you didn't include a decent fallback.

I really don't think going to such lengths is worth the effort at all.
0
 
LVL 10

Expert Comment

by:bluefezteam
ID: 21761702
http://www.templatemonster.com/

This site uses a custom select box to achieve a customised background, you may be able to see how they've achieved it, just click their drop downs
0

Featured Post

What Security Threats Are You Missing?

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

Join & Write a Comment

International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now