Lỗi Css trên studio

css ở trên studio có bị sai không vì code mình test trên trình duyệt không bị


@conheosua88
Chào bạn, mình có đọc qua code của bạn thì chỉ thấy phần css của các item. Bạn có thể cung cấp thêm phần code của thẻ view/div cha của các item được không.

Tuy nhiên mình có một vài gợi ý cho bạn để style lại như bạn mong muốn:

  1. Mình thấy ở browser bạn đang sử dụng reset css, bạn nên xem thử trong file _reset.css đã configs nhưng gì và từ đó ánh xạ sang tini apps. Ví dụ thường thì các reset css sẽ sử dụng box-sizing: border-box cho div vì vậy để cho giống bạn có thể set css cho view như sau:
view {
   box-sizing: border-box;
}

  1. Ngăn text xuống hàng:
.products_cate-item {
   // ...
   white-space: nowrap;
}
  1. Swipe
.products_cate{
   // ...
   display: flex;
   overflow-x: auto;
}

@conheosua88
Bạn có thể sửa lại css bằng cách bỏ set height (do bạn đã xài padding. nếu set height thì nên bỏ padding-top/padding-bottom) và thêm field white-space: nowrap như bạn Trí ở trên nha.

.products_cate-item {
  ...
  white-space: nowrap;
}

Một lựa chọn nữa là bạn có thể compile file _reset.scss của bạn sang file css(tcss) và import vào bất cứ file tcss nào của Tini App nhé, hoặc import vào root file(app.tcss), ví dụ:

/* file app.tcss*/
@import "./styles/reset.tcss";

/* css codes */
view {
  display: block;
}

Xem thêm tại Import in TCSS