Javascript 无法在响应设计中重写css元素

这是最新的。在CSS中有一个名为

tbox

的元素。它是一个宽度为100%的内联框。在主页上，它会根据其父项完美地调整其宽度，并且反应非常好，但是当我进入帖子时，它的宽度会根据里面的内容而变化。这里有一些

当我打开它时，这就是帖子-

这是

tbox

.tbox{
    display: inline-block;
    width: 100%;
    height: auto;
    padding: 2px;
    background-color: #FFFFFF;
    border-radius: 25px;

}

当我将宽度更改为850px时，它在桌面上运行良好，但我无法在响应设计中覆盖宽度。它始终保持850px

---

那么，如果宽度为850px，如何使其响应？或者还有其他的解决方案吗？

您可以使用媒体查询来实现类似的响应，并且此代码必须先将下面的主css编写为与您的主css相同

.tbox{
display: inline-block;
width: 90%; // change it as you want
height: auto;
padding: 2px;
background-color: #FFFFFF;
border-radius: 25px;
}

然后写下面的代码

@media (max-width:780px) { 
.tbox{
 display: inline-block;
 width: 100%; // change it as you want
 height: auto;
  padding: 2px;
  background-color: #FFFFFF;
  border-radius: 25px;
  } 
  }

---

您需要在

.tbox

类中添加

框大小调整

属性-

.tbox {
    display: inline-block;
    width: 100%;
    height: auto;
    padding: 2px;
    background-color: #FFFFFF;
    border-radius: 25px;
    box-sizing: border-box; // add this property in main css
}

---

尝试这样编写媒体查询，那么您的div就会有响应

.tbox{
显示：内联块；
宽度：100%；
高度：自动；
填充：2px；
背景色：#FFFFFF；
边界半径：25px；
}
@介质（最大宽度：767px）{
.tbox{
显示：内联块；
宽度：90%；//此处更改百分比
高度：自动；
填充：2px；
背景色：#FFFFFF；
边界半径：25px；
}
}
@介质（最大宽度：1024px）和（最小宽度：768px）{
.tbox{
显示：内联块；
宽度：100%；//此处更改百分比
高度：自动；
填充：2px；
背景色：#FFFFFF；
边界半径：25px；
}
}
@介质（最大宽度：414px）和（最小宽度：100px）{
.tbox{
显示：内联块；
宽度：70%；//此处更改百分比
高度：自动；
填充：2px；
背景色：#FFFFFF；
边界半径：25px；
}
}

问题不在于

tbox

在代码中搜索

.item.post.hentry

并更改

宽度：850px至<代码>最大宽度：850px

.item .post.hentry {
    max-width: 850px;
}

在那个维度上什么都没有。这是一个导致问题的父元素吗？请添加更多细节，你想在这里实现什么？我想你可以在你的帖子页面中检查它的父容器的宽度。确保有一个宽度：100%。否则，您应该查看媒体查询尝试使用
minwidth和max width