Hỏi về việc các phần của menu đa cấp có khoảng cách?

E dc giao bài tập làm 1 menu ngang, code như sau:

Kq là show được nhưng giữa các phần của menu lại có khoảng trắng !!
Ai biết fix thì chỉ cho e lý do và solution luôn nhé ^^
Em cảm ơn nhiều :blush:

Cách 1:

ul {
  display: flex;
}

Cách 2:

.menu .list li {
  display: inline-block;
  margin: -4px;
}

Đây luôn:
https://css-tricks.com/fighting-the-space-between-inline-block-elements/

1 Like

Cho e hỏi sao phải để margin: -4px; thế a ?

Em không dịch được a ơi, dịch vào chỗ nhưng cũng k hiểu nữa :frowning:

Em hiểu margin là gì?

1 Like

Em biết margin mà, ý e là sao lại để value là -4px ?

Normal html, nếu không có css để reset lại các thuộc tính. Sẽ mặc định có khoảng cách 4px giữa các thẻ ul khi sử dụng inline-block. Để tránh việc này thì em trừ đi 4px margin so với mặc định là 0. Vì vậy sẽ là -4

À, em có đọc trên trang này thì hiểu rồi :smiley:


hình như cách của anh @qtd phải thêm margin-top: 0; để tránh menu bị hút lên phía trên nữa thì phải ?
Cảm ơn mọi người !

83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?