DGrid：将列拟合到数据

Question

我正在使用这样的DGrid：

var dgrid = new OnDemandGrid({
    store: myStore,
    columns: [
        {field: "name"},
        {field: "age"}
    ],
    showHeader: false
},divName);
dgrid.startup();

目前正在调整自己：

我希望第一列的大小适合最长的数据：

如果从商店中删除了最长的名称，则第一行应该像这样重新调整大小：

I have created a JSFiddle with a DGrid as a template for answers.

---

编辑：我在调整DGrid时看到了Sitepen article，但它没有提到如何解决这个问题。

Edit2：有人在another forum上提出同样的问题。

Answer 1

您可以在min-width中使用CSS。当内容小于它时，它将保持min-width，并在内容超过宽度时展开以适应内容。

你可以这样使用它：

div {
    vertical-align:top;
}

.Container {
    border:1px solid Black;
}

.name {
    display:inline-block;
    height:150px;
    text-align:center;
    min-width:100px;
}

.number {
    display:inline-block;
    height:150px;
    text-align:center;
    width:100px;
}

你可以在这里看到这一点 - ＆gt; http://jsfiddle.net/q9Vtx/2/

请参阅min-width属性，让内容适合＆＃39;。

希望这有帮助!!!