javascript - div上具有自动宽度的DOM

假设我创建了一个名为.main-nav的div

然后，我对节标题进行了如下设置：

.main-nav{
    width: auto;
}

在div中有另一个名为＃navbar-brand的div

#navbar-brand​{
    padding:15;
}​​

如果我想做一个主导航栏宽度大于768px的DOM，那么＃navbar-brand的填充就消失了，该怎么办？

最佳答案

当然，这可以使用javascript完成，但是当视口大小超过768px时，使用纯css media queries可以更有效地实现。请注意，媒体查询方法假定.main-nav宽度为视口宽度的100％，如果.main-nav的父容器小于视口，则此方法不一定能按预期工作

将其插入默认＃navbar-brand-settings之后的css文件中

@media screen and (min-width: 768px) {
 #navbar-brand​{
     padding: 0;
 }​​
}

另外，您还需要在页面上添加meta viewport -tag，以使其与视口大小正常工作，请阅读更多here。

关于javascript - div上具有自动宽度的DOM，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38092438/