Opened 8 years ago

Closed 6 years ago

#8594 closed bug (notabug)

bottom line of selected item in autocomplete dropdown is invisible if backgound image applied to <a/> element

Reported by: deng.hui5 Owned by: deng.hui5
Priority: minor Milestone: none
Component: ui.autocomplete Version: 1.9.0-rc.1
Keywords: Cc:
Blocked by: Blocking:

Description

CSS:

.ui-menu a.test{
	background: white url('/a/b/icon16.png') no-repeat;
	padding-left: 16px;
}

JS:

$(this).data( "autocomplete" )._renderItem = function( ul, item ) {
	return $( "<li></li>" )	.data( "item.autocomplete", item ).append( "<a class=test>" + item[code] + "</a>" ).appendTo( ul );

Change History (6)

comment:1 Changed 8 years ago by Scott González

Owner: set to deng.hui5
Status: newpending

If you're using a custom render method, I'm not sure what you want us to do. At a minimum we need a reduced test case showing the problem.

comment:2 Changed 8 years ago by deng.hui5

Status: pendingnew

I find <a> element in dropdown menu use margin:-1px to reserve space for border of focused item. so I change it to:

.ui-menu a{
	margin:1px 0px 0px;
}
.ui-menu a.ui-state-focus{
	margin:0px;
}

seems fixing this bug.

comment:3 Changed 7 years ago by Scott González

Milestone: 1.9.01.10.0

comment:4 Changed 7 years ago by bavanyo

Status: newopen

comment:5 Changed 7 years ago by tj.vantoll

Milestone: 1.10.0none

comment:6 Changed 6 years ago by Scott González

Resolution: notabug
Status: openclosed

We no longer use anchors in the menu items, so this is purely a custom rendering issue now.

Note: See TracTickets for help on using tickets.