html - 在小分辨率下使用 PrimeNG 的 p-steps 组件

标签 html angular primeng

我正在尝试从 PrimeNG 中缩小 p-steps 组件为了防止在小屏幕分辨率下溢出。这是我当前的代码:

    <div class="d-flex card mb-4">
       <p-steps [model]="items" [(activeIndex)]="currentWizardCard" [readonly]="false"></p-steps>
    </div>

这在大屏幕上看起来不错:Link to image

但是当降低屏幕分辨率时,步骤会溢出:Link to image

我想知道是否有一种方法可以包装步骤或以不会导致溢出的方式显示它们。

最佳答案

如果您使用超过 4 个步骤,

p-steps 组件在小屏幕分辨率下无法正常工作。 对于我的项目,我使用了来自 Angular Material Component 的垂直步进器 enter image description here

关于html - 在小分辨率下使用 PrimeNG 的 p-steps 组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66469317/

相关文章:

javascript - NgRx - 减少存储的优先级和执行顺序

angular - 空注入(inject)器错误 : No provider for FormBuilder

javascript - Chrome 渲染内联 block 高度错误

javascript - 试图制作一个可点击的表格来更改无序列表中的值

javascript - 空注入(inject)器错误: StaticInjectorError[JobcounterComponent -> FetchJobDataService]

angular5 - 如何设置 PrimeNG p-dropdown 的默认值

angular - 关闭后启动对话框未打开

javascript - 如何让函数每5秒执行一次?

javascript - jQuery 到传统 Javascript 的映射

angular - 将 Angular 应用程序从版本 4.x.x 更新到 6.0