按文本长度设置 div 宽度答案

【问题标题】：Set div width by text length按文本长度设置 div 宽度
【发布时间】：2012-10-26 03:28:49
【问题描述】：

我做了这个 jquery：

定义持有者div：

var cimHolder = componentWrapper.find('.cim_holder');

如果title存在数据等于title：

    if(data.attr('title') != undefined && !isEmpty(data.attr('title'))){
                cimData = data.attr('title');
                cimExist = true;

        }

如果标题存在，则显示在 div 中：

        if(cimExist){
            cimHolder.css('width', 'auto');//reset
            cimHolder.html(cimData);

按字符长度设置 div 宽度：

            var hossz = cimData.length*6.5;
            //console.log(cimData);
            if(parseInt(cimHolder.css('width'), 10)>200){
                cimHolder.css('width', hossz+'px');
            }
            }

但是这样如果你得到很多宽字符，div会很小，但是当你得到很多窄字符时，它会很长。如何解决这个问题？

编辑：如果我将 div 设置为自动或 100%，它将不适合文本，只需使用屏幕中的所有空间。

【问题讨论】：

标签： jquery html size font-size

【解决方案1】：

像 span 或 a -tags (display: inline;) 这样的内联元素的宽度仅与其内容一样宽。如果你有一个像 div (display: block;) 这样的块元素，默认情况下宽度是 100%。所以如果你不需要块元素，你可以使用 display: inline;

您是否记录了 parseInt(cimHolder.css('width'), 10) 的值？可能无法正确解析“px”单位。

问候

【讨论】：

【解决方案2】：

为什么不使用

overflow:visible;

这样它总是必须匹配包含文本的宽度，无论多长。

【讨论】：

【解决方案3】：

你可以使用这两个 css 属性：

max-width: 100px;
min-width: 50px;

【讨论】：