在div中包装文本而不是展开它

-2

注意：我的div有一个自动宽度，我想保留它。我认为我的问题将得到解决，如果我不知何故使用CSS来给出与其当前（自动）宽度相等的最大宽度，但我没有找到任何东西。在div中包装文本而不是展开它

问题：（忽略文本的背景，在其上的信息显示是透明的股利）

合适的宽度在该行应该打破：

这里是我的CSS：

div.chat div#chatOutput { 
    height: 370px; 
    margin-bottom: 5px; 
    max-height: 450px; 
    min-height: 130px; 
    border: 1px solid; 
    overflow-y: scroll; 
    padding: 5px; 
}

而我的HTML：

<div class="chat"> 
      <h4><a title="Click to copy channel link" href="#">#</a> <span id="chatChannelName">General</span></h4> 
      <div id="chatOutput"></div> 
      <br /> 
      <div class="chat-group"> 
       <input type="text" maxlength="80" class="form-control" id="chatInput" placeholder="Type your message.." /> 
       <button class="btn btn-primary" id="chatSend"><i style="float: none;" class="fa fa-send"></i> Send</button> 
      </div> 
     </div>

来源

2017-10-05 TheNewGuy

您可以将您的代码片断^ h ERE？ –

我们应该用photoshop还是用一些代码来帮助你？ –

尝试在目前的div附近添加另一个div并给它一个固定的宽度。这应该防止内部div比外部div更大。下面是一个例子：

HTML：

<div class="fixed"> 
    <div class="autosize"> 
     <p>Hello World</p> 
    </div> 
</div>

CSS：

.fixed { 
    width: 400px; 
} 

.autosize { 
    /* Your own autosize-code */ 
}

来源

2017-10-05 06:53:00 Fluttershy

我已经拥有了，但我想保留父'div'没有任何特定的宽度，所以它扩展为匹配其内容的宽度。 – TheNewGuy

尝试overflow:

一些属性：
visible | hidden | scroll | auto | inherit

来源

2017-10-05 06:53:33 merlin

在div中包装文本而不是展开它

回答

相关问题