• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 160
  • Last Modified:

Trying to remove the Title Header ( with sorting arrows ) from a Custom List - SharePoint 2013

Hello Experts,

I have been successful removing the title header that labels and sorts A Custom List using CSS.
The thing is I am using the Custom List as an App Part to add to particular pages.
No problems there, but I will have to add a CEWP to remove the header with CSS for every  page.

What I am trying to accomplish is to remove the header( sorter /title header from the source itself - the original Custom List ) so that the user can just select the app part and not have to add a CEWP.

I have been a little blind without SP2010 and its Designer View and would had just removed the aforementioned but in 2013 SPD, I have no clue and couldn't make heads or tails about what to remove to attain the same resolution.

I have been doing my homework and learning how to use F12 on IE, but in this instance it hasn't assisted.

Your help is greatly appreciated.

CSS I had been using or similar to hide the header:
#hide-title .ms-viewheadertr {
    display: none;

Open in new window

1 Solution
Hiding with CSS sounds like the correct technique to use, and your example CSS looks like it is "sort of" correct, so I'm guessing this is more a problem with implementation?

I would advise you spend more time using the deveopler tools (F12)  (or even better, use Chrome and it's dev tools as I find them better/easier to use).

When in this tool, you can access the element you want to hide, and change the CSS inline and see the results.  If the structure of the css is such that your change is not being applied due to the cascade, then you should also be able to se that (you will be able to see what elements are applied and what have been ignored as these will have a line through them).

I would guess that your selector rule is possibly not quite correct, but this is something you can work out using browser developer tools.  It looks fine to me.

Once this is all correct, then the issue will be in how you are applying your CSS to the page.  Ideally, you should upload your custom CSS to the "Style Library" built in library, create a custom masterpage,  link to your own custom CSS in that after it has loaded the standard CSS, and then apply that masterpage to any pages on the site you want to apply your css.

However, it is not always possible or desirable to edit the masterpage in this way, so here are some other options:
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now