I am using Wordpress as a CMS for a project which makes extensive use of custom post types. I need to display columns in admin panels for each custom post type in a different way.

I've already created the necessary columns and populated them. What I need to do is to adjust the CSS a bit. Most importantly I'm trying to tweak the width of certain columns. For example I don't need a column listing the post ID to be as wide as the post name.

I enqueued a stylesheet in the admin panels for my custom post types but I can't get it right to style the column widths.

I tried to adjust the max-width of th or td elements, but it's ineffective. From firebug I can see the css style is there, but it's doing nothing.

While I could find a lot of tutorials to add/edit custom columns, I didn't really gather much information about how to style such columns. Any hint?

Thank you!

5 Answers 5


I found a solution that works for me!

I dropped this code in functions.php :

add_action('admin_head', 'my_column_width');

function my_column_width() {
    echo '<style type="text/css">';
    echo '.column-mycolumn { text-align: center; width:60px !important; overflow:hidden }';
    echo '</style>';

Thanks Nicusor: Works great. I was able to change the width of selected columns on the Posts panel (e.g Title, Author, Categories) with your solution as follows:

add_action('admin_head', 'my_admin_column_width');
function my_admin_column_width() {
    echo '<style type="text/css">
        .column-title { text-align: left; width:200px !important; overflow:hidden }
        .column-author { text-align: left; width:100px !important; overflow:hidden }
        .column-categories { text-align: left; width:100px !important; overflow:hidden }

You should be able to set the column width using CSS quite easily. You can use the .column-{name} class to apply styles to the column cells (both th and td). For example:

.column-mycolumn { width:20%; }

Make sure you don't have other styles overruling your column width because of CSS specificity rules. Also, long words without spaces or large images could force the column to be wider than specified in some browsers.

  • it worked! thank you so much! I was overcomplicating my css evidently
    – unfulvio
    Commented Nov 16, 2011 at 12:47
  • I have a column named "clicks" and this code placed in my childtheme styles.css file have no effect in the admin posts list! .column-clicks { width:60px; } Commented Apr 14, 2012 at 2:36

You can try this solved your problems:

add_action('admin_head', 'my_admin_custom_styles');
function my_admin_custom_styles() {
    $output_css = '<style type="text/css">
        .column-date { display: none }
        .column-tags { display: none }
        .column-author { width:30px !important; overflow:hidden }
        .column-categories { width:30px !important; overflow:hidden }
        .column-title a { font-size:30px !important }
    echo $output_css;
  • no semicolon at each CSS lines.
    – northtree
    Commented Dec 20, 2016 at 10:37
  • This was very useful. Just to add, Wordpress is also used on large screen mobiles by some of our editor users, so we added media queries as the !important rules above broke the default design of WP's admin listing. This is a very handy suggestion though. Thank you!
    – PKHunter
    Commented Feb 7, 2017 at 1:41
  • By default, some columns have class .fixed which results in width: 15%; . This ensures those columns have more room allocated to them than others (which are likely to break multiple lines.) But in practice, this can result in columns getting more space than they need! You can adapt Gaurang's function above to avoid giving extra space for your less important columns. e.g.: .column-tags { width: initial !important; }. Commented Jun 7, 2018 at 19:30

When adding custom columns, you can also directly insert a small style snippet which you can use to size the column. A bit dirty, but saves another filter / call:

 * Add custom columns to submission list
 * @param $columns
 * @return mixed
function submission_add_columns( $columns ) {
    $columns['name']    = 'Name';
    $columns['iban']    = 'IBAN<style>.column-iban { width: 150px !important;}</style>';
    $columns['bic']     = 'BIC<style>.column-bic { width: 100px !important;}</style>';
    $columns['receipt'] = 'Receipt<style>.column-receipt { width: 175px !important;}</style>';
    $columns['status']  = 'Status<style>.column-status { width: 75px !important;}</style>';
    $columns['action']  = 'Action<style>.column-action { width: 225px !important;}</style>';
    // add the thickbox library
    wp_enqueue_style( 'thickbox' );
    wp_enqueue_script( 'thickbox' );

    return $columns;

add_filter( 'manage_edit-submissions_columns', 'submission_add_columns' );

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.