如何使 div 对屏幕尺寸无响应答案

【问题标题】：How to make the div non-responsive to the screen size如何使 div 对屏幕尺寸无响应
【发布时间】：2017-12-20 14:51:53
【问题描述】：

见附件。我在顶部有 6 个徽标，在底部有 7 个从屏幕伸出的徽标。如何创建底部 div 不响应？

【问题讨论】：

你需要一些 html 和样式表。
请举个例子，并可能重新提出问题。底部的“没有响应”并不是很能描述您想要什么，当图像挂在页面上时，它看起来已经不是很响应了。
感谢您的所有提示。但是，当 div 总数扩展容器宽度 1000px 时，它会下降到第二行。目前，我为每个 div 使用 float:left，但 inline-block 具有相同的结果。如何解决这个问题？ bobitmarketingsolutions-com.webflow.io/homepage

标签： css

【解决方案1】：

在其上添加固定宽度。以像素为单位。

宽度：700px；

【讨论】：

感谢您的所有提示。但是，当 div 总数扩展容器宽度 1000px 时，它会下降到第二行。目前，我为每个 div 使用 float:left，但 inline-block 具有相同的结果。如何解决这个问题？ bobitmarketingsolutions-com.webflow.io/homepage

【解决方案2】：

更新：

从页面中删除这些divs 以获得想要的效果：

<div class="partner-divider"></div>

您需要将display 属性设置为：inline-block

<div style="display: inline-block">Text</div>

如果您改变主意并希望它响应：

HTML：

<div id="myDiv"> Content </div>

CSS：

#myDiv
{
    min-height: 100%;
    max-height: 100%;
}

参考文献：

How to make div not larger than its contents?

Make div NOT auto stretch to container width

Div 100% height of page responsive

【讨论】：

感谢您的所有提示。但是，当 div 总数扩展容器宽度 1000px 时，它会下降到第二行。目前，我为每个 div 使用 float:left，但 inline-block 具有相同的结果。如何解决这个问题？ bobitmarketingsolutions-com.webflow.io/homepage
您能否更具体地说明您需要显示的内容以及您拥有多少个 div？
这是我遇到问题的页面：bobitmarketingsolutions-com.webflow.io/homepage 在顶行，有 6 个 div 有徽标图像和 5 个 div 有分隔线。在最下面一行，有 7 个带有徽标的 div，以及 6 个带有分隔符的 div。我想在这篇文章的顶部显示类似初始附件的内容。谢谢
立即查看我的答案

【解决方案3】：

希望这对您有所帮助。

<div class="col-md-6">
  <div style="width: 500px;">
    <div class="box" id="A"></div>
    <div class="box" id="B"></div>
    <div class="box" id="C"></div>
    <div class="box" id="D"></div>
    <div class="box" id="E"></div>
    <div class="box" id="F"></div>
    <div class="box" id="G"></div>
    <div class="box" id="H"></div>
    <div class="box" id="I"></div>
  </div>
</div>

【讨论】：

如果类框的总宽度超过500px，则下降到第2行。有没有办法预防？
@erin027 你可以使用样式定义： word-wrap: break-word ;
我正在使用图像。请参阅“信任我们的品牌”部分。 bobitmarketingsolutions-com.webflow.io/homepage