HTML column below minimum width in WordPress

On a downloads overview page for a download manager plugin for WordPress there are multiple columns and the shortcode column overlaps the author column. I’ve set that column’s minimum width to 175px but when the window is resized still shrinks below it’s minimum width.

.column-wpdmshortcode{
    -webkit-font-smoothing: subpixel-antialiased;
    border-bottom-color: rgb(225, 225, 225);
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-collapse: separate;
    color: rgb(50, 55, 60);
    display: table-cell;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: normal;
    height: 22px;
    line-height: 19.6000003814697px;
    padding-bottom: 8px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 8px;
    text-align: left;
    vertical-align: middle;
    width: 77px;
    word-wrap: break-word;

    min-width: 175px;
}

All inherited css properties:
http://spencerlarry.com/docs/all-inherited-styles.txt

Read More

enter image description here

I’m wondering how it’s possible to have an element like this be below it’s min-width.
Any ideas how I could fix this problem?

Related posts

1 comment

  1. min-width and max-width are not supported on table cells.

    From the CSS2.1 specification:

    In CSS 2.1, the effect of ‘min-width’ and ‘max-width’ on tables,
    inline tables, table cells, table columns, and column groups is
    undefined.

    So one thing you should do is to set the width of the cell (and not the min-width), and use the table-layout property to fixed so the cells widths will no be longer auto calculated.

Comments are closed.