Đặt chiều rộng và chiều cao trên thẻ A

Có thể đặt chiều rộng và chiều cao tính bằng pixel trên thẻ neo không? Tôi muốn có thẻ neo để có hình nền trong khi giữ lại văn bản bên trong neo.

li {
  width: 32px;
  height: 32px;
  background-color: orange;
}

li a {
  width: 32px;
  height: 32px;
  background-color: red;
}

<li><a href="#">Something</a></li>

Bạn cần phải làm cho neo của bạn display: blockhoặc display: inline-block;sau đó nó sẽ chấp nhận các giá trị chiều rộng và chiều cao.

Bạn cũng có thể sử dụng display: inline-block. Ưu điểm của việc này là nó sẽ đặt chiều cao và chiều rộng giống như một phần tử khối nhưng cũng đặt nó theo dòng để bạn có thể có một thẻ khác nằm ngay bên cạnh, cho phép không gian cha.

Bạn có thể tìm hiểu thêm về các thuộc tính hiển thị ở đây

Tất cả các đề xuất này hoạt động trừ khi bạn đặt các neo trong danh sách UL.

<ul>
    <li>
        <a>click me</a>>
    </li>
</ul>

Sau đó, bất kỳ quy tắc biểu định kiểu tầng nào sẽ bị ghi đè trong trình duyệt Chrome. Chiều rộng trở thành tự động. Sau đó, bạn phải sử dụng các quy tắc CSS nội tuyến trực tiếp trên chính neo.

Đây không phải là một bản sao chính xác (theo như tôi có thể tìm thấy), nhưng đây là một vấn đề phổ biến .

display:blocklà những gì bạn cần. nhưng bạn nên đọc thông số kỹ thuật để hiểu tại sao.

Dưới đây làm việc cho tôi

display: block;
width: 100%;