:: Forum >>

Make a "sortable".png for headers

By default there is no "up" & "down" arrow to help end users know columns are sortable off-hand. If I created a sort.png file using the grid.png arrows which style would I apply the background:url ?
Joseph
Monday, July 9, 2007
If I understand correctly you want to assign some image to the non-sorted state. You can use .aw-sort-none class, but you should also restore the display:inline-block rule, because normally .aw-sort-none has display:none value -

.aw-grid-control .aw-header-0 .aw-grid-sort {
    display: inline-block;
}


.aw-gecko .aw-header-0 .aw-grid-sort {
    display: -moz-inline-box;
}


.aw-sort-none .aw-grid-sort {
    background: url(???.png);
}


.aw-sort-ascending .aw-grid-sort {
    background: url(up.png);
}


.aw-sort-descending .aw-grid-sort {
    background: url(down.png);
}
Alex (ActiveWidgets)
Tuesday, July 10, 2007
Alex,

Thank You for your direction! What I did was open grid.png containing the up/down arrows and saved a version with just the both arrows together. One minor tweak was to the:

.aw-gecko .aw-header-0 .aw-grid-sort {
display: -moz-inline-box;
width:18px;
}

Needed to increase width of the display box to contain the with of the new image.
Thanks again.
Joseph
Tuesday, July 10, 2007

This topic is archived.


Back to support forum

Forum search