CSS 建议 max-right 或解决方法？答案

【问题标题】：CSS suggestion max-right or workaround?CSS 建议 max-right 或解决方法？
【发布时间】：2013-06-16 07:27:05
【问题描述】：

是否有计划将其添加到 CSS 中？

min-right:10% ;
max-bottom:100px ; ...

类似

<div style="min-left:1000px; min-right:10%; max-left:1200px; 
            position:fixed" ></div>

今天有什么解决方法可以申请吗？答案可能包括 javascript、jquery 插件等。

对于一些背景：

我们在上面示例中的固定 div 将在 1280 窗口宽度从右侧 10% / 128px 开始，但不会早于左侧 1000px 开始，因此最多 152 像素宽，受水平位置限制1000px 和 1152px 与这些标记的间隙相等，如果该 div 在另一个居中对齐的 div 内。 - 如果你尝试<div style=”right:10%;left;1000px; max-width: calc(90%-1000); position:fixed，会发生不一样的情况，但最大宽度将始终被强制，我们的 div 将被强制为两者：从左侧 1000 像素和从右侧 10%，即使它的内容实际上“想要”只是更少的像素宽度......

并解释为什么现在还需要max-left:1200px：如果窗口的宽度会更大，例如1600px，那么当然又是最小。窗口右端的间隙为 10% / 160 像素，左端为 1000，因此 div 的最大宽度将导致 440 像素，但如果它今天只有 100 像素怎么办？然后我们还想确保它从左侧开始 1000 到 1200 之间的某个位置，而不仅仅是从右侧开始的 10%，即使继承的对齐应该是 'centered 或 'right 并且 div 只包含 10px 的内容，这不会导致其中距左侧1235px甚至1430px但最多不超过1200px。

【问题讨论】：

你能提供一些你需要图片的例子吗？
@Darkyen，谢谢，上面已编辑。
我之前的编辑从标题中删除了“关键字”，因为它们没有任何用途（除了混淆您试图提出的问题）。如果您需要标记您的问题，请明智地使用标签（css 和 css3 没有不同的目的，并且您的问题中没有任何内容需要彼此重叠。同样，stylesheet 及其 (near ) 重复alternate-stylesheet 无用；选择一个并在那里添加其他主题）。唯一应该在标题中的是问题标题本身，而不是元信息。
如果问题的根源在于浏览器窗口的宽度，您可以尝试使用媒体查询为不同大小的窗口应用不同的 CSS。
请停止在您的标题中添加“关键字”，因为它们被各种人反复删除。（此帖子被自动标记为进行如此多的编辑）

标签： css jquery-plugins stylesheet

【解决方案1】：

不要使用绝对定位，除非您的 CSS 水平较高。灾难的配方和涵盖其他内容的内容。
- 了解现在可用的显示值，例如 inline-block 和 table-cell
- 当然要了解float，还有clear property
- 了解什么是 clearfix 以及与属性clear 的区别。 Implementation of clearfix
- clip() 可以使用，只能用于绝对定位的元素，所以它在这里是相关的
通过absolute positioning (the bonus tip part)了解一个很酷的技巧。
了解min-width、max-width、min-height 和max-height。
- min-height 很有用，即使没有足够的内容也不应该裁剪背景图像
- max-width 和 min-width 对于流体布局很有用，无需媒体查询和断点即可响应，ems 中的宽度等
现在可以使用 CSS3 控制背景图像：background-size 等参见E. Weil 'standardista' website

没有添加您提到的属性的计划，但有一个 calc() 值可能会对您有所帮助。请参阅MDN calc()（以及 caniuse.com 以了解兼容性...）

【讨论】：

【解决方案2】：

好的！假设您的 div 宽度为 400 像素。

+----------------------+
|                      | <div id="main">
+----------------------+

并且你想给这个 div 内的 min-left 50px 一个 300 像素的新 div 宽度。

+----------------------+
|   +------+           |
|   |      |           | <div id="left">
|   +------+           |
+----------------------+

如果你想要这个 div max-left 100px 怎么办。这将是这样的。

+----------------------+
|       +------+       |
|       |      |       | <div id="left">
|       +------+       |
+----------------------+

如果你将 margin: 0 auto; 应用到这个 div 会怎样。这将真正按照需要管理内容，是/否：no。当你给 margin: 0 100px; 或类似的东西会随心所欲地管理时，是/否：yes。所以，就像我们在 css 中所做的那样，一切都是用深刻的思考编写的，不需要给出 min-left 或类似的东西。并且有很多技巧可以按照您想要的方式进行。

【讨论】：