NativeScript / NativeScript/android
margin CSS not working as expected on android
Chưa có ai nhận issue này.
- Ngôn ngữ chính
- C++
- Star
- 563
- Fork
- 144
- Merge trung bình
- 10 giờ 46 phút
- Pull request đã merge (30 ngày)
- 14
Mô tả
Environment
OS: macOS 14.4.1
CPU: (10) arm64 Apple M1 Pro
Shell: /bin/zsh
node: 20.11.1
npm: 10.2.4
nativescript: 8.6.5
# android
java: 11.0.22
ndk: Not Found
apis: Not Found
build_tools: Not Found
system_images: Not Found
# ios
xcode: 15.3/15E204a
cocoapods: 1.15.2
python: 3.12.2
python3: 3.12.2
ruby: 2.7.8
platforms:
- DriverKit 23.4
- iOS 17.4
- macOS 14.4
- tvOS 17.4
- visionOS 1.1
- watchOS 10.4
Dependencies
"dependencies": {
"@angular/animations": "17.3.2",
"@angular/common": "17.3.2",
"@angular/compiler": "17.3.2",
"@angular/core": "17.3.2",
"@angular/forms": "17.3.2",
"@angular/platform-browser": "17.3.2",
"@angular/platform-browser-dynamic": "17.3.2",
"@angular/router": "17.3.2",
"@apollo/client": "3.9.9",
"@mnd/external-web-view": "file:../app-plugins/dist/packages/external-web-view/mnd-external-web-view-1.0.1.tgz",
"@nativescript/angular": "17.0.0",
"@nativescript/core": "8.6.2",
"@nativescript/iqkeyboardmanager": "2.1.1",
"@nativescript/localize": "5.2.0",
"@nativescript/mlkit-barcode-scanning": "2.1.0",
"@nativescript/mlkit-core": "2.1.0",
"@nativescript/secure-storage": "3.0.3",
"@nativescript/theme": "3.0.2",
"@nativescript/ui-charts": "0.2.4",
"apollo-angular": "6.0.0",
"apollo3-cache-persist": "0.15.0",
"d3-ease": "3.0.1",
"graphql": "16.8.1",
"graphql-tag": "2.12.6",
"intl": "1.2.5",
"moment": "2.30.1",
"nativescript-health-data": "file:../app-plugins-customized/nativescript-health-data/publish/package/nativescript-health-data-2.0.0.tgz",
"nativescript-oauth2-ext": "file:../app-plugins-customized/nativescript-oauth2-ext/publish/package/nativescript-oauth2-ext-3.0.3.tgz",
"nativescript-sqlite": "2.8.6",
"nativescript-sqlite-commercial": "file:../app-plugins-customized/commercial-sqlite/nativescript-sqlite-commercial-1.8.0.tgz",
"nativescript-sqlite-encrypted": "file:../app-plugins-customized/commercial-sqlite/nativescript-sqlite-encrypted-1.6.0.tgz",
"nativescript-ui-calendar": "15.2.3",
"nativescript-ui-gauge": "15.2.3",
"qs": "npm:querystring@0.2.1",
"rxjs": "7.8.1",
"util": "0.12.5",
"uuidjs": "5.0.1",
"zone.js": "0.14.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "17.3.2",
"@angular/compiler-cli": "17.3.2",
"@graphql-codegen/cli": "5.0.2",
"@graphql-codegen/fragment-matcher": "5.0.2",
"@graphql-codegen/introspection": "4.0.3",
"@graphql-codegen/typescript": "4.0.6",
"@graphql-codegen/typescript-apollo-angular": "4.0.0",
"@graphql-codegen/typescript-operations": "4.2.0",
"@nativescript/android": "8.6.2",
"@nativescript/ios": "8.6.4",
"@nativescript/types": "8.6.1",
"@nativescript/webpack": "5.0.18",
"@ngtools/webpack": "17.3.2",
"@types/d3-ease": "3.0.2",
"@types/intl": "1.2.2",
"@types/lodash": "4.17.0",
"@types/node": "20.12.2",
"keycloak-request-token": "0.1.0",
"rimraf": "5.0.5",
"sass": "1.72.0",
"ts-node": "10.9.2",
"typescript": "5.2.2"
}
Describe the bug
It seems like when setting margin with a css class on Android the syntax of margin: 0 0 0 0; is not adequately merged as it does not overwrite margin-left margin-right margin-top margin-bottom like on iOS plattform.
To Reproduce
.zero {
margin: 0 0 0 0;
padding: 0 0 0 0;
margin-right: 0; //bugfix for android
margin-left: 0 // bugfix for android
}
Expected behavior
margins set via margin overwrite margin-left, margin-right, margin-top, margin-bottom
Hướng dẫn đóng góp
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Hướng nghiên cứu
Bắt đầu bằng cách tái hiện ví dụ CSS .zero trên Android và so sánh hành vi margin của nó với iOS. Theo dõi cách shorthand margin: 0 0 0 0 được áp dụng và xác minh rằng thay đổi đã hoàn tất khiến nó ghi đè cả bốn margin riêng theo từng cạnh mà không cần các khai báo riêng biệt cho margin-left và margin-right.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Đánh giá
- Công nghệ
- android, css
- Lĩnh vực
- mobile-dev
- Loại issue
- Lỗi
- Độ khó
- 4/5
- Thời gian dự kiến
- 3-5 ngày
- Mức độ hoạt động
- Đình trệ
- Độ rõ ràng
- Khá rõ ràng
- Mức phù hợp với người mới
- 35/100