javascript - CSS calc 和 JS calculate 不相等

标签 javascript css


我在 css 中计算元素宽度,并在 js 中执行相同的操作。
第一个用于元素样式,第二个用于轮播轨道计算。

我的 CSS:

.category-carousel .carousel-item {
    width: calc((100vw - 80px) / 7); // result is 262.544px
}

和我的 JS:

 var itemWidth = (window.innerWidth - 80) / 7; // result is 262.857px

结果是 262.544 和 262.857
(我使用了超过 200 个元素,所以 200 * 0.313 给我 62px 的问题)

为什么它以这种方式工作?

演示

https://jsfiddle.net/2nwLq7vd/5/
宽度和控制台结果不相等

最佳答案

你可以看到我在你的代码中所做的更改,它与设置 0 时的边框填充有关,然后它给我相同的值你应该在你的 js 计算中为每个元素添加边框和边距 enter image description here

关于javascript - CSS calc 和 JS calculate 不相等,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46585999/

相关文章:

javascript - 如何在 CodeceptJS 和 NightmareJS 中将条件应用于 E2E 测试

javascript - 通过 promise 包装代码

javascript - 如何仅在切换时验证表单

css - 缩写标签的标题可以设置样式吗?

html - 添加填充到文本而不是图像

Javascript 使用数据库中的数据添加新的选择索引

javascript - iPhone 上的动态下拉菜单

css - Chrome shadow-root 应用奇怪的 CSS 规则

jquery 定制的 html5 视频在 ipod 中不起作用

html - IE11 中的边框折叠和 colspan