Предложение CSS max-right или обходное решение?

Question

Есть ли планы добавить это в CSS?

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

что-то вроде

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

Есть ли обходной путь, чтобы применить сегодня? Ответы могут включать в себя JavaScript, JQuery плагины и т.д.

Для некоторого фона:

Наш основной ДИВ в примере выше, в 1280 оконного ширины будет, начиная с 10%/128px справа, но не ранее, начиная чем 1000px слева, таким образом, ширина не более 152 пикселей, ограниченная горизонтальными позициями 1000px и 1152px с равным разрывом с этими метками, если этот div находится внутри другого с центрированным выравниванием. - Если вместо этого вы попробуете <div style=”right:10%;left;1000px; max-width: calc(90%-1000); position:fixed, то не то же самое произойдет, но максимальная ширина будет принудительно всегда, и наш div будет вынужден быть одновременно: 1000px слева и 10% справа, даже когда контент действительно «хочет» просто так меньше ширины пикселей ...

И объяснить, почему теперь также требуется max-left:1200px: Если ширина окна будет больше, например 1600 пикселей, то, конечно, снова мин. промежуток в правом конце окна будет 10%/160 пикселей и влево 1000, поэтому максимальная ширина div приведет к 440px, но что, если он имеет только 100 пикселей сегодня? Затем мы также хотим убедиться, что он начинается где-то между 1000 и 1200 слева, а не только 10% справа, даже если унаследованный выравнивание должен быть «центрирован» или «справа», а div просто включает 10 пикселей содержимого, которые не должны в нем должно быть 1235px, далекое от левого или даже 1430px, но не более 1200px.

Answer 1

1. Не использовать абсолютное позиционирование, за исключением, если ваш уровень в CSS является продвинутым. Рецепт катастрофы и контента, охватывающий другой контент.
   • Узнайте о теперь используемых значениях дисплея, как inline-block и table-cell
   • Узнайте о поплавке, конечно, и clear недвижимости
   • Узнайте о том, каком clearfix есть и разница со свойством clear. Implementation of clearfix
   • clip() может быть использован только на абсолютно позиционируемых элементов, так что это отношение здесь
2. Узнайте о прохладном трюк с absolute positioning (the bonus tip part).
3. Узнать больше о min-width, max-width, min-height и max-height.
   • min-height полезно, когда фоновое изображение не должно быть обрезано даже без достаточного содержания
   • max-width и min-width полезны для жидкости макетов, быть отзывчивым без необходимости медиа-запросов и контрольных точек, ширин в em с, и т.д.
4. фоновые изображения теперь можно управлять с помощью CSS3: background-size и т.д. См E. Weil 'standardista' website

Там нет пла нс добавления указанных вами свойств, хотя есть значение calc(), которое может вам помочь. См. MDN calc() (и caniuse.com для совместимости ...)

Answer 2

Хорошо! предположим, что у вас ширина div 400 пикселей.

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

И вы хотите дать min-left 50px внутри этого div новую ширину div 300 пикселей.

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

Что делать, если вы хотите, чтобы этот div max-left 100px. Это будет так.

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

А что, если применить запас: 0 авто;. Это действительно будет управлять содержимым точно так же, как хотите, да/нет: нет. Когда вы даете margin: 0 100px; или что-то подобное обойдется, если хотите, да/нет: да. Итак, подобно тому, как мы делаем в css, все написано в глубоком мышлении, и вам не нужно давать мини-левое или что-то вроде вас. И есть много трюков, чтобы делать то, что вы хотите.