Как правильно затенять вкладки на поле тени? - PullRequest
0 голосов
/ 15 мая 2019

Я пытаюсь правильно скрыть вкладки на этом сайте.Не уверен, что проблема заключается в значениях или разметке HTML.

div.ui-tabs-panel.ui-widget-content.ui-corner-bottom {
    background-color: #ffffff;
    box-shadow: 0 3px 6px         rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}

div.variableselector_valuesselect_variabletitle_panel {
    background-color: #ffffff;
}


a.ui-tabs-anchor {
    box-shadow: 1px 4px 2px       rgba(0,0,0,0.16), 1px 0px 5px rgba(0,0,0,0.23);
}

вот скриншот:

enter image description here

1 Ответ

0 голосов
/ 15 мая 2019

Я думаю, что вы ищете это.

enter image description here

    <div class="tabs">
        <div class="tab"></div>
        <div class="tab"></div>
    </div>
    <div class="box-container">
    </div>

.box-container{
  position: absolute;
  top:72px;
  left:4em;
  tansform: translate(0,-50%);
  height: 50%;
  width:60%;
  border: 2px solid #ddd;
  z-index:0;
  background: #fff;
  filter:drop-shadow(2px 2px 5px #555)
}
.tabs{
  position: absolute;
  display:flex;
  left:4em;
  top:1.5em;
  justify-content: space-between;
   z-index:999;
}
.tab{
  height:50px;
  width:150px;
  border:1px solid #ddd;
  border-bottom:0;
  background-color: #fff;
  margin-right: 10px;
  box-shadow: 0 -5px 18px -5px #555;
  box-shadow: 18px 0 18px -5px #555;
  box-shadow: -5px 0 18px -5px #555;
  }
...