函数,CSS Calc函数未固定高度属性"/>
css的高度设定为函数,CSS Calc函数未固定高度属性
我试图开发一个聊天插件,并且在显示邮件时遇到问题。在这里,它是:(需要一些部分被隐藏,因为它是一个高度机密的项目)CSS Calc函数未固定高度属性
$inputContainerHeight: 70px;
#tab-conversation {
height: 100%;
}
#conversation-container {
height: -moz-calc(100% - #{$inputContainerHeight});
height: -webkit-calc(100% - #{$inputContainerHeight});
height: calc(100% - #{$inputContainerHeight});
overflow-y: auto;
padding: 10px;
padding-bottom: 0;
}
#input-container {
height: $inputContainerHeight;
}
当消息显示在conversation-container的input-container被推出因为conversation-container是一个小孩,并不想坚持其高度。即使使用max-height属性,它也无法工作。但是,当我用固定高度替换calc函数时,高度是固定的。我错过了什么?
编辑:我正在使用scss
2017-07-31
Baboo_
+0
首先,你需要一个预处理器(如sass或更少)来使用像变量$ inputContainerHeight' –
+0
然后这是什么奇怪的语法'#{$ inputContainerHeight}' –
+0
我正在使用sccs a并且需要'#{$ inputContainerHeight}'语法来插值。没有它,我会获得'高度:calc(100% - $ inputContainerHeight);' –
更多推荐
css的高度设定为函数,CSS Calc函数未固定高度属性
发布评论