Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations derfloh on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

table layout: fixed and hover

Status
Not open for further replies.

JohnandSwifty

Technical User
May 31, 2005
192
GB
Hi

I have a table that uses the elipsis css function in its cells (in divs). Because of this i obviously need to set the table-layout to fixed, whenever i do this, the :hover style for the rows no longer applies the background colour change... anything obvious?... it still works in firefox...

Thanks

 
Hi

These are my row and cell styles...

table.dataGrid tr td {
padding: 8px 5px;
border-bottom: 1px solid #C1E1F0;
}

table.dataGrid tr:hover {
background-color:#DFF7ED;
cursor:pointer;
}

table.dataGrid tr:hover td {
border-bottom: 1px solid #000000;
}

These are the styles for the divs in the cells...

.rowLev02a {
margin-left:18px;
color:#999999;
text-overflow:ellipsis;
overflow:hidden;
white-space:nowrap;
}
.rowLev02b {
color:#999999;
text-overflow:ellipsis;
overflow:hidden;
white-space:nowrap;
}
 
Well IE6 doesn't support the hover psuedo class on anything other than <a> elements anyway.
I'm not sure about IE7's support.

I'm still having trouble visualising what you are doing and the problem you are having. Can you give a URL to the page in question?

<honk>*:O)</honk>

Earl & Thompson Marketing - Marketing Agency Services in Gloucestershire
 
The table is a result set returned from an ajax query.

What would you suggest for the hover?.. an onmouseover this.style type thing - or is there a better way to change a tr style on mouseover?

(i'd rather not post the URL in a forum)
 
You could do it with a javascript event certainly.

A nice way is to combine the 2. Use CSS where you can but use Javascript to append a css when hovered over (this is how Suckerfish dropdowns work).

By appending a class you can easily modify the styles later without having to touch the javascript.

Also, you can use IE conditional comments to only load the style-appending-javascript when needed.


I'm not sure the lack of support for :hover is your problem, but it sounds like it might be.

<honk>*:O)</honk>

Earl & Thompson Marketing - Marketing Agency Services in Gloucestershire
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top