Closed
Bug 229886
Opened 21 years ago
Closed 21 years ago
CSS 2.1 dynamic pseudo-classes are not supported for <select> boxes
Categories
(Core :: CSS Parsing and Computation, defect)
Tracking
()
VERIFIED
DUPLICATE
of bug 163503
People
(Reporter: suomi, Assigned: dbaron)
Details
User-Agent: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.5) Gecko/20031007
Build Identifier: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.5) Gecko/20031007
CSS 2.1 dynamic pseudo-classes :hover, :active are not supported correctly on
select-boxes.
the select-box, when single clicked on the down-arrow, unfolds shortly, but
instantly claps back. only if you double-click into the text area (as opposed to
the down-arrow) the select-box unfolds so that you can do a choice.
this stems from the CSS settings, because, if in the CSS sheet, you uncomment
the specifications for "select", then everything works fine (i.e. as documented)
Reproducible: Always
Steps to Reproduce:
1. load the attached index.xhtml
2. take care, that it uses the attached formate.css
3. on the displayed page click the down arrow of a select box.
4. the select box unfolds quickly, but then disappears again.
5. double-click into the text field of a select-box.
6. the select box unfolds and stays unfolded as documented
7. to cross-check: uncomment the select specs in the css file (i.e put a /* in
front and */ at the back of them)
8. redo the above tests and everything works fine.
Actual Results:
a select-box with CSS 2.1 dynamic pseudo-class specs for :hover and :focus does
not unfold as documented (i.e. when single-clicked on the down-arrow)
Expected Results:
unfold the select-box and let it unfolded when single clicked on the down arrow
of the select-box
the index.xhtml:
<?xml version="1.0" encoding="unicode"?>
<?xml-stylesheet type="text/css" href="formate.css"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Script-Type" content="text/Javascript" />
<link rel="stylesheet" href="formate.css" type="text/css" />
<title>address Advanced Search Parameters</title>
<script type="text/javascript">
//<![CDATA[
function ReadCookie(cookieName) {
var theCookie=""+document.cookie;
var ind=theCookie.indexOf(cookieName);
if (ind==-1 || cookieName=="") return "";
var ind1=theCookie.indexOf(';',ind);
if (ind1==-1) ind1=theCookie.length;
return unescape(theCookie.substring(ind+cookieName.length+1,ind1));
}
function checkEmpty() {
document.auth.maxitaxi.value = "search"
document.auth.submit()
}
function create_mailolisto() {
document.auth.maxitaxi.value = "mailolisto"
document.auth.submit()
}
function check_LDAP() {
document.auth.maxitaxi.value = "checkLDAP"
document.auth.submit()
}
function newEntry() {
document.auth.maxitaxi.value = "newEntry"
document.auth.submit()
}
function clearEntryFields() {
for (var i =0; i < document.auth.elements.length; i++) {
if (document.auth.elements[i].type == "text")
document.auth.elements[i].value = ""
}
}
function clearCompFields() {
for (var i =0; i < document.auth.elements.length; i++) {
if (document.auth.elements[i].type == "select-one")
document.auth.elements[i].selectedIndex = 0
}
for (var i = 0; i < document.auth.limit10.length; i++) {
if (document.auth.limit10[i].value == "limit100") {
document.auth.limit10[i].checked = 1
break
}
}
}
function suomoHelp() {
var w = window.open("/help/help_searchadvanced.html", "searchWindow")
w.focus()
}
function setK() {
var bgc = ReadCookie("bgcolor")
if (bgc != "") document.bgColor = bgc
}
//]]>
</script>
</head>
<body onload="setK()">
<form name="auth" action="searchosearch.php" method="post"
target="addressResultWindow">
<table id="titcol" summary="page-title">
<tr>
<th colspan="2" rowspan="1">
<h3>Advanced Search Criteria</h3></th>
</tr>
</table>
<a name="top"></a>
<table summary="top-control-buttons">
<tr>
<td class="n"><input type="button" value="close" onClick="window.close()" />
<input type="button" value="toButtom" onClick="window.location='#down'" /></td>
<td class="nr"><input type="button" value="help" onClick="suomoHelp()" /></td>
</tr><tr>
<td class="n"><input type="reset" value="reset" />
<input type="button" value="clearEntries" onClick="clearEntryFields()" />
<input type="button" value="resetComparisons" onClick="clearCompFields()" /></td>
<td class="nr"><input type="submit" value="search" onClick="checkEmpty()" /></td>
<input type="hidden" name="__pagemadeby" value="cgi/search_advanced.php" />
<input type="hidden" name="maxitaxi" />
</tr>
</table>
<table summary="page-content">
<tr>
<th>date_last_action<br />(date)<br /><input type="checkbox"
name="attr[date_last_action]" /></th>
<th>date_next_action<br />(date)<br /><input type="checkbox"
name="attr[date_next_action]" /></th>
<th>name<br />(blob)<br /><input type="checkbox" name="attr[name]"
checked="1" /></th>
<th>givenname<br />(blob)<br /><input type="checkbox"
name="attr[givenname]" checked="1" /></th>
</tr>
<tr>
<td class="c"><select size ="1" name="opt[date_last_action]">
<option>EXACTLY AT</option>
<option>BEFORE</option>
<option>AFTER</option>
<option>BETWEEN DATE</option>
<option>IS ZERO</option>
<option>IS NOTZERO</option>
<option>IS NULL</option>
</select></td>
<td class="c"><select size ="1" name="opt[date_next_action]">
<option>EXACTLY AT</option>
<option>BEFORE</option>
<option>AFTER</option>
<option>BETWEEN DATE</option>
<option>IS ZERO</option>
<option>IS NOTZERO</option>
<option>IS NULL</option>
</select></td>
<td class="c"><select size ="1" name="opt[name]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
<td class="c"><select size ="1" name="opt[givenname]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
</tr>
<tr>
<td class="c"><input type="text" name="crit[date_last_action]"
value="" /></td>
<td class="c"><input type="text" name="crit[date_next_action]"
value="" /></td>
<td class="c"><input type="text" name="crit[name]" value="" /></td>
<td class="c"><input type="text" name="crit[givenname]" value=""
/></td>
</tr>
<tr>
<th>phone<br />(blob)<br /><input type="checkbox" name="attr[phone]"
checked="1" /></th>
<th>mail<br />(blob)<br /><input type="checkbox" name="attr[mail]" /></th>
<th>action<br />(blob)<br /><input type="checkbox" name="attr[action]"
checked="1" /></th>
<th>comment<br />(blob)<br /><input type="checkbox" name="attr[comment]"
checked="1" /></th>
</tr>
<tr>
<td class="c"><select size ="1" name="opt[phone]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
<td class="c"><select size ="1" name="opt[mail]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
<td class="c"><select size ="1" name="opt[action]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
<td class="c"><select size ="1" name="opt[comment]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
</tr>
<tr>
<td class="c"><input type="text" name="crit[phone]" value="" /></td>
<td class="c"><input type="text" name="crit[mail]" value="" /></td>
<td class="c"><input type="text" name="crit[action]" value=""
/></td>
<td class="c"><input type="text" name="crit[comment]" value=""
/></td>
</tr>
<tr>
<th>address<br />(blob)<br /><input type="checkbox" name="attr[address]"
checked="1" /></th>
<th>businesscategory<br />(blob)<br /><input type="checkbox"
name="attr[businesscategory]" checked="1" /></th>
<th>url<br />(blob)<br /><input type="checkbox" name="attr[url]" /></th>
<th>addon<br />(blob)<br /><input type="checkbox" name="attr[addon]"
/></th>
</tr>
<tr>
<td class="c"><select size ="1" name="opt[address]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
<td class="c"><select size ="1" name="opt[businesscategory]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
<td class="c"><select size ="1" name="opt[url]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
<td class="c"><select size ="1" name="opt[addon]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
</tr>
<tr>
<td class="c"><input type="text" name="crit[address]" value=""
/></td>
<td class="c"><input type="text" name="crit[businesscategory]"
value="" /></td>
<td class="c"><input type="text" name="crit[url]" value="" /></td>
<td class="c"><input type="text" name="crit[addon]" value="" /></td>
</tr>
<tr>
<th>title<br />(blob)<br /><input type="checkbox" name="attr[title]"
/></th>
<th>history<br />(blob)<br /><input type="checkbox" name="attr[history]"
/></th>
<th>remarks<br />(blob)<br /><input type="checkbox" name="attr[remarks]"
/></th>
<th>counter<br />(int)<br /></th>
</tr>
<tr>
<td class="c"><select size ="1" name="opt[title]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
<td class="c"><select size ="1" name="opt[history]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
<td class="c"><select size ="1" name="opt[remarks]">
<option>IS LIKE</option>
<option>IS EXACTLY</option>
<option>IS NULL</option>
<option>IS NOTNULL</option>
<option>IS EMPTY</option>
<option>IS NOTEMPTY</option>
<option>DOES NOT CONTAIN</option>
<option>IS UNIQUE</option>
<option>GROUP BY</option>
</select></td>
<td class="c"><select size ="1" name="opt[counter]">
<option>EQUAL TO</option>
<option>GT THAN</option>
<option>LT THAN</option>
<option>LE THAN</option>
<option>GE THAN</option>
<option>BETWEEN</option>
</select></td>
</tr>
<tr>
<td class="c"><input type="text" name="crit[title]" value="" /></td>
<td class="c"><input type="text" name="crit[history]" value=""
/></td>
<td class="c"><input type="text" name="crit[remarks]" value=""
/></td>
<td class="c"><input type="text" name="crit[counter]" value=""
/></td>
</tr>
</table>
<br />
<table summary="bottom-control-buttons">
<tr><td class="n">Today:</td><td class="n">2004-01-02</td><td
class="n"> </td><td class="n"><input type="radio" name="limit10"
value="limit10" />Limit 10</td>
<td class="n"> </td><td class="n">Order By<select name="orderx" size="1">
<option>counter</option>
<option>action</option>
<option>addon</option>
<option>address</option>
<option>businesscategory</option>
<option>comment</option>
<option>date_last_action</option>
<option>date_next_action</option>
<option>givenname</option>
<option>history</option>
<option>mail</option>
<option>name</option>
<option>phone</option>
<option>remarks</option>
<option>title</option>
<option>url</option>
</select>
</td></tr>
<tr><td class="n">Tomorrow:</td><td class="n">2004-01-03</td>
<td class="n"> </td><td class="n"><input type="radio" name="limit10"
value="limit100" checked="1" />Limit 100</td></tr>
<tr><td class="n">Yesterday:</td><td class="n">2004-01-01</td>
<td class="n"> </td><td class="n"><input type="radio" name="limit10"
value="nolimit" />No Limit</td></tr>
</table>
<br />
<table summary="buttom-control-buttons">
<tr>
<td class="n"><input type="reset" value="reset" />
<input type="button" value="clearEntries" onClick="clearEntryFields()" />
<input type="button" value="resetComparisons" onClick="clearCompFields()" /></td>
<td class="nr"><input type="button" value="search" onClick="checkEmpty()" /></td>
</tr>
</table>
<input type="button" value="close" onClick="window.close()" />
<input type="button" value="toTop" onClick="window.location='#top'" />
</form>
<a name="down"></a>
</body>
</html>
the formate.css:
@charset "ISO-8859-1";
/* body background color default: #00eedd */
body { color: black; background: #00eedd ;
font-family:Arial, Helvetica, sans-serif; }
h1{ font-size:12pt; font-weight:bold; color:#000000;}
h2 { font-size:11pt; font-weight:bold;}
h2 { color: #000000}
a:link { color:#0000FF;text-decoration:none }
a:visited { color:#FF0000;text-decoration:none }
a:active { color:#0000FF}
input:link { color:black; }
input:visited { color:blue;text-decoration:none }
input:hover { color:red;text-decoration:none }
input:active { color:green }
textarea:link { color:black; }
textarea:visited { color:blue;text-decoration:none }
textarea:hover { color:red; text-decoration:none }
textarea:active { color:green }
select:hover { color:red;text-decoration:none }
select:active { color:green }
p { font-size:10pt; color:#000000; }
ul { font-size:10pt; color:#000000; }
li { font-size:10pt; color:#000000; }
b { font-size:10pt; font-weight:bold; color:#000000; }
i { font-size:10pt; color:#000000; }
/* color for invalid mail addresses */
#mycol { color: red }
/* tables */
/* title table default color #D3D6D6 */
#titcol { background: #D3D6D6 ; width: 100% ;
border-collapse: collapse ;
border: 2px ridge white ; }
/* general tables */
table { border-collapse: collapse ; width: 100% ;
} /* piccolo tables */
table.p { border-collapse: collapse ; width: 50% ; }
/* general table cells */
td { border: 2px ridge white ; }
td.v { border: 2px ridge white ; vertical-align: top; }
td.w155 { border: 2px ridge white ; width: 155px ; }
td.n { border: none ; }
td.nr { border: none ; text-align: right; }
td.c { border: 2px ridge white; text-align: center; }
td.nt { border-top: none ; text-align: center; }
td.nb { border-buttom: none ; text-align: center; }
td.ntb { border-top border-buttom: none ; text-align: center; }
th { border: 2px ridge white ; }
|
||
Comment 2•21 years ago
|
||
WFM. (WinXP Gecko/20040102)
|
||
Comment 3•21 years ago
|
||
Oh, and please attach the simple testcase as an attachment ... don't post it as
a comment. Thanks! =:-)
|
||
Comment 4•21 years ago
|
||
*** This bug has been marked as a duplicate of 163503 ***
Status: UNCONFIRMED → RESOLVED
Closed: 21 years ago
Resolution: --- → DUPLICATE
|
||
Updated•20 years ago
|
Status: RESOLVED → VERIFIED
Whiteboard: DUPEME
You need to log in
before you can comment on or make changes to this bug.
Description
•