2
Хи!полная ширина отзыв стрелка на нижней части div
В настоящее время я пытаюсь сделать следующее Nav
, но в конечном итоге получают следующие
Как я могу понизить высоту стрелки я нахожусь добавляя внизу, но сохраняя полную ширину?
nav {
position: relative;
display: inline-block;
height: 50px;
width: 100%;
text-align: center;
color: white;
background: gray;
line-height: 50px;
text-decoration: none;
padding-bottom: 15%;
background-clip: content-box;
overflow: hidden;
}
nav:after {
content: "";
position: absolute;
top: 50px;
left: 0;
background-color: inherit;
padding-bottom: 50%;
width: 57.7%;
z-index: -1;
-webkit-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: rotate(-30deg) skewX(30deg);
-ms-transform: rotate(-30deg) skewX(30deg);
transform: rotate(-30deg) skewX(30deg);
}
<nav>nav</nav>
вместо всех перекоса логики, вы можете использовать http://apps.eky.hk/css-triangle-generator/ и добавить его в навигационной панели. Это проще –