Tuesday 7 August 2012

Change Default List Layout using css during runtime


To hide the Header of the list we can insert the following css in the CEWP above the list or anywhere on page.

.ms-viewheadertr {
    DISPLAY: none
}

To hide the new.gif image in front of the Name of newly added item we can insert the following css
IMG.ms-newgif {
    DISPLAY: none
}

To highlight the row of the list item in different color on the mouse hover on the item insert the following css. Here in the below example we will make the background transparent.

.ms-itmhover {
    BACKGROUND-COLOR: transparent
}
.ms-vb2 {
    COLOR: black; FONT-WEIGHT: normal
}


.ms-alternating {
    BACKGROUND-COLOR: transparent
}


To change the background of the bottom paging to transperant insert the following css

.ms-bottompagingline1 {
    BACKGROUND: #f7f7f7
}
.ms-bottompaging .ms-vb {
    BACKGROUND: #f7f7f7
}
.ms-bottompagingline2 {
    BACKGROUND: #f7f7f7
}
.ms-bottompagingline3 {
    BACKGROUND: #f7f7f7
}

No comments:

Post a Comment