时间戳

首页 > 解决方案 > 链接整个 DIV

html - 链接整个 DIV

问题描述

我想链接“项目属性”DIV。如果需要，我可以编辑 HTML 和 CSS，但我不知道如何使它工作。

.item-attributes {
  display: table;
  width: 100%;
  height: 50px;
}

.item-attributes__item {
  display: table-cell;
  padding: 5px;
  text-align: center;
  vertical-align: middle;
}

.item-attributes__link i {
  margin: 0;
  margin-top: 0px;
  position: absolute;
  top: 50%;
  right: 0;
  vertical-align: middle;
}
<div class="item-attributes">
  <div class="item-attributes__item">
    <a href="#" class="item-attributes__link">
      <i class="fa fa-long-arrow-right"></i>
    </a>
  </div>
</div>

标签： htmlcss

解决方案

另一种方法是使.item-attributes__item成为您的链接。

.item-attributes {
  display: table;
  width: 100%;
  height: 50px;
}

.item-attributes__link {
  display: table-cell;
  padding: 5px;
  text-align: center;
  vertical-align: middle;
  background-color: #dfd;

}

.item-attributes__link i {
  margin: 0;
  margin-top: 0px;
  position: absolute;
  top: 50%;
  right: 0;
  vertical-align: middle;
}
<div class="item-attributes">
    <a href="#" class="item-attributes__link">
      <i class="fa fa-long-arrow-right">Item</i>
    </a>
</div>

推荐阅读