3.2.0

Row/Column header highlight color

I've used the the following to change the color of the column/row header.

.active-scroll-top .active-box-item {background: #ccff99}
.active-scroll-left .active-box-item {background: #ffcc99}
.active-scroll-corner .active-box-item {background: #ff99cc}

I noticed that the headers were still highlighted with a light gray color. How do I change the color of this highlight?
Andy
March 9,
Try the following example andy,
I am sure you will get

<html>
<head>
<style>
.active-box-item {background: #ccff99}
.active-box-item {background: #ffcc99}
.active-box-item {background: #ff99cc}
</style>
</head>
<body>
<table>
<tr>
<th class="active-box-item">eno </th>
<th class="active-box-item">name </th>
<th class="active-box-item">marks </th>
</tr>
<tr>
<td >101 </td>
<td >veeru </td>
<td >80 </td>
</tr>
<tr>
<td >102 </td>
<td >jyostna </td>
<td >80 </td>

</tr>

</table>
</body>
Jyostna
March 16,
Here is the part of CSS that deals with mouse over/down color changes:

.active-header-over {
    border-color: #f9b119;
    background: #fcc247!important;
}

.active-header-over .active-box-item {
    border-color: #f9a900;
    background: #faf9f4;
}

.active-header-over .active-box-resize {
    background: none;
}

.active-header-pressed {
    border-color: threeddarkshadow threedhighlight threedhighlight threeddarkshadow;
}

.active-header-pressed .active-box-item {
    position: relative;
    left: 1px;
    top: 1px;
    border-color: threedface;
}


note, that the header consists of two nested DIVs, inner one is marked with .active-box-item tag.

Also sometimes it is necessary to use !important to override/fix selector bugs.
Alex (ActiveWidgets)
March 16,

This topic is archived.

See also:


Back to support forum