При использовании box-sizing: border-box в CSS я предполагаю, что общая ширина элемента будет определена в его значении «ширина». Поэтому, если я скажу, что ширина деления составляет 20 пикселей, а правая граница - 10 пикселей, в итоге я получаю поле размером 20 пикселей, а половина - это правая граница. Преодолевая его до точки, где я установить ширину 10px и правой границы, тоже, как здесь:Почему размер окна: рамка по-прежнему показывает границу с шириной 0px?
#box{
overflow: hidden;
width: 10px;
box-sizing: border-box;
height: 100px;
background: black;
border-right: 10px solid red;
}
коробки будет состоять только из красной границы. Что должно произойти, когда я устанавливаю ширину на 0px? Я думал, что все это исчезнет, но нет, результат точно такой же, как и выше: jsFiddle
Мой вопрос в том, является ли это ожидаемым поведением. Мне кажется непоследовательным. Я бы хотел, чтобы окно исчезло, только манипулируя шириной/высотой. Спасибо за любой вклад.
Какой браузер вы используете? Не все браузеры напрямую поддерживают размер окна. Некоторые из них имеют собственный собственный размер коробки, такой как '-moz-box-sizing' и' -webkit-box-sizing'. Если вы хотите что-то скрывать, рассмотрите использование 'display: none;' или 'visibility: hidden;' – Jrod
Я мог бы также использовать молоток, чтобы сломать яйцо ... но я стараюсь не делать :) Просто шучу, я действительно нужно, чтобы элемент исчезал так ... подумайте о разрезе ... – Seka
Вы имеете в виду какую-то анимацию, где вы медленно уменьшаете ширину до нуля? Не совсем уверен, что вы имеете в виду под щелью. Если бы вы могли уточнить, чего именно вы пытаетесь достичь, возможно, еще одно подходящее решение. Как и в большинстве случаев, есть много способов сделать это. Возможно, молоток с когтями - это плохой выбор, но, возможно, расколотый молот находится прямо вверх по вашей аллее. – Jrod