Clever Geek Handbook

Enter button image - not working in Chrome & Safari?

I have the following code in my index.html

<li>
<select name="cmbtype" style="display:none" id="cmbtype" onChange="Changetype()">
<option value="0">
<input type="image" src="images/ocean.png" value="Play" onclick="previewplay(); " /> 
</option>
</select> 
</li>

In firefox, opera and IE 7 I can see the ocean.png and can push it. When I do this, it appropriately plays the mp3 it should!

When I load this same code in Safari (Windows and Mac) as well as Chrome, Ocean.png is not displayed and the button is not pressed?

Is there something I can add or do to make this code / design work in Safari and Chrome?

thank

0


source to share


2 answers


Why do you have input in your choice?

It probably inherits the display: none of them get rendered, which I would assume would be the correct behavior.



Maybe IE, firefox and opera are detecting this illegal syntax and rewriting the input outside of the select, but webkit doesn't.

+7


source


This is illegal HTML markup and shouldn't work.

  • <Li> denotes a list item and must be inside <ol> (ordered list) or <ul> (unordered list)

  • <select> can have <optgroup> and <option>

  • <option> can have symbols, but not an element



In this case, the way Chrome and Safaris do it is the correct way to do it .

+3


source






More articles:


All Articles