如下图所示,这是SAP Spartacus 嵌套label的一个使用场景,cx-org-list label标签选择器里,设置了padding-inline-end: 20px:

那么嵌套的label,得到的padding-inline-end效果就是40px:

尽管在Chrome开发者工具面板上只能看到20px的padding:

这也解释了为什么我重构之后(即去除了嵌套label)在Chrome开发者工具里,将padding手动设置成40px之后,仍然能够得到换行的效果:

上图的before fix场景,实际的padding应该是40px,肉眼上也能看出比after fix的20px场景的padding要大两倍。

更多Jerry的原创文章,尽在:“汪子熙”:

关于SAP Spartacus嵌套label的padding问题相关推荐

  1. SAP Spartacus User form通过label标签的实现原理

    第一次见到这个有点诧异,居然是通过label实现的: 上述页面可以从SAP Spartacus User list,点击某个user进入明细页面开始编辑: 看到这个ng-reflect-name=ro ...

  2. SAP Spartacus 的 CSS 架构

    在 Angular 中,组件的 CSS 样式被封装进了自己的视图中,而不会影响到应用程序的其它部分. 通过在组件的元数据上设置视图封装模式,你可以分别控制每个组件的封装模式. 可选的封装模式一共有如下 ...

  3. 如何在 SAP Spartacus 里添加自定义页面 - Custom Page

    网友提问 Add a custom page to Spartacus I would like to add a custom sub page (http://localhost:4200/ima ...

  4. SAP Spartacus B2B user列表对应的Angular Component

    如下图所示,这个页面点击之后: 显示的Angular UI,在SAP Spartacus里并没有单独的Angular Component来实现: 在userCmsConfig里能发现,SAP Comm ...

  5. Jerry在2020 SAP全球技术大会的分享:SAP Spartacus技术介绍的文字版

    这是Jerry 2020年的第86篇文章,也是汪子熙公众号总共第268篇原创文章. 这篇文章的视频版本如下: https://v.qq.com/x/page/b3212l6kqvg.html 这个分享 ...

  6. SAP Spartacus Page Layout学习笔记

    文档地址: https://sap.github.io/spartacus-docs/page-layout/#outlet-position Spartacus is based on a sing ...

  7. rxjs的map和switchMap在SAP Spartacus中的应用 -将高阶Observable进行flatten操作

    switchMap相关文章 rxjs里switchMap operators的用法 通过rxjs的一个例子, 来学习SwitchMap的使用方法 rxjs switchMap的实现原理 rxjs的ma ...

  8. 如何定制化SAP Spartacus的购物车图标

    SAP Spartacus默认的购物车图标如下图所示: 使用如下的css代码对其外观进行修改: /* You can add global styles to this file, and also ...

  9. SAP Spartacus 的基于outlet 的页面扩展

    outlet 是 SAP Spartacus 提供 partners 一种将 custom UI 插入 Spartacus 标准 DOM 的一种手段. outlets get added for ea ...

最新文章

  1. 《Adobe Photoshop CS5中文版经典教程(全彩版)》—第1课1.2节使用工具
  2. 简单实例使用_一个关于jmeter的使用简单实例
  3. Python自动解压各种压缩文件
  4. 浏览器访问web服务器的图解和tomcat体系结构图
  5. mysql重置所有表_Mysql脚本之清空当前数据库下的所有表中数据,并重置自增id
  6. 关于BeanUtils.copyProperties的用法和优缺点
  7. mouseover和mouseenter的区别
  8. 中美线径对照表_美标线径与国标对照及导线介绍
  9. python变量名长度有限制吗_url长度有限制么?
  10. 螃蟹效应:表现优秀遭嫉妒,如何应对职场竞争?
  11. PostgreSQL备份和恢复
  12. 安卓手机误删文件恢复
  13. Quartus18.1安装USB Blaster驱动蓝屏
  14. 纯真IP库详解(转)
  15. Warning: count(): Parameter must be an array or an object that implements Countable快速解决方法
  16. Unity Editor模式编辑属性即时生效
  17. (二)SDRAM——SDRAM操作时序
  18. 节假日api接口之获取指定日期的节假日信息
  19. TLP(Transmission Line Pulse)
  20. 微信小程序之 打印json数据或者object类型的数据技巧

热门文章

  1. SQL Server 查询数据库中所有的表名及行数
  2. 数据中心两种常用流量模型运用mininet的实现
  3. 更新系统时跳过某个软件包
  4. Linux学习笔记三--vim
  5. 在Windows 2000下优化Oracle9i性能[转]
  6. Java高级特性 第10节 IDEA和Eclipse整合JUnit测试框架
  7. webservice用cxf发布SOAP
  8. python3学习第三周
  9. poj1673 EXOCENTER OF A TRIANGLE
  10. Extjs 4.2 MVC+ThreeJs学习笔记(二)一个简单的ThreeJS场景