如何使WordPress的小部件容器全宽

Question

我构建了一个插件，可以在调用短代码后显示整个页面的标签。 这就是我运行它时的样子。 当我安装它时，这就是它的外观

您不仅可以看到选项卡不是完整的页面，而且选项卡样式表已设法影响整个网站并使其混乱。 我想使选项卡全宽度（从页面的一端到另一端），并且我希望插件的样式仅影响插件返回的滑块。 我使用elementor页面构建器，并且尝试将elementor容器的margin设置为0。虽然减少了空间，但是从图像中可以看到它仍然不够用。我的网站的布局已设置为100％全角。我将不胜感激。 这是下面插件的CSS。

.elementor-container {
  margin: 0px !important;
}

.bs-example {
  margin-top: 20px;
  margin-bottom: 20px;
}

.hide23 {
  border-style: none !important;
}

.tab-pane {
  margin: 20px;
}

.selected {
  border-bottom: 2px solid #FF7F50;
}

@media screen and (min-device-width: 300px) {
  .tab-content {
    width: 50% !important;
  }
}

@media screen and (max-width: 800px) {
  /*  li {width:50%;}*/
  ul {
    display: none !important;
  }
}

@media all and (max-width: 959px) {
  .elementor-container {
    max-width: 100% !important;
  }
  .elementor-column-gap-default {
    max-width: 100% !important;
  }
}

h3 {
  font-size: 2vw;
  color: black;
}

a {
  background-color: #fff !important;
}

ul:hover {
  color: transparent!important;
}

ul {
  border-style: none !important;
  /*border-bottom: 2px solid #FF7F50  !important;*/
}

{
  display: inline !important;
  color: black;
}

.span-active {
  border: 2px solid #FF7F50;
  border-radius: 100%;
  font-size: 15px;
  padding-right: 5px;
  padding-left: 5px;
  margin-right: 5px;
  margin-left: 5px;
  margin-top: -5px;
  color: white;
  background-color: #FF7F50;
}

.span-inactive {
  border: 2px solid grey;
  border-radius: 100%;
  font-size: 15px;
  padding-right: 5px;
  padding-left: 5px;
  margin-right: 5px;
  margin-left: 5px;
  margin-top: -5px;
  color: grey !important;
  background-color: white;
}

.inactive {
  color: grey !important;
}

.progress-bar {
  background-color: #FF7F50;
}

让我知道您是否还有其他需要。如果答案很明显，我深表歉意。我是WordPress开发的新手