Mail.ruПочтаМой МирОдноклассникиВКонтактеИгрыЗнакомстваНовостиКалендарьОблакоЗаметкиВсе проекты

как сделать 3 угольные кнопки в css?

Rai Zap Ученик (93), закрыт 4 года назад
делаю кнопки, а они получается как 2 тип на фотке. делаю кнопки как 3 тип, но одна кнопка закрывает другую из за того что её контур квадратный .как сделать контур 3 угольным?
Лучший ответ
Elepsis Eclipse Гений (64039) 4 года назад
Не CSS - никак. Нужен SVG

<svg height="52" width="112">
  <polygon class="btn" points="2,2 2,50 100,50"/>
  <polygon class="btn" points="10,2 110,2 110,50"/>
</svg>

.btn {
  fill: orange;
  stroke: black;
  stroke-width: 2px;
  border: 1px solid red;
}

.btn:hover {
  fill: red;
}
Остальные ответы
Анти Советчик Искусственный Интеллект (125424) 4 года назад
У меня тоже первая мысль про SVG как у автора первого ответа. Вторая мысль - clip-path, но в этом случае лучше без бордера, потому что из трех сторон будет только две с бордером.
Похожие вопросы