【问题标题】:Logo position changes when zooming out (CSS/Angular4+)缩小时徽标位置发生变化(CSS/Angular4+)
【发布时间】:2020-01-15 18:28:26
【问题描述】:

我有一个带有徽标 (MostafaOmar) 的导航栏,当我缩小时,位置也会移动。

尝试缩放到 70%,您会看到徽标的位置也会移动。

我怎样才能让它保持 100% 时的状态?

Logo


.nav .nav-heading .brand {float: left}

【问题讨论】:

  • 自动丢失边距

标签: javascript html css angular frontend


【解决方案1】:

看起来像 .container 类的父 div 的大小正在调整,这正在移动内容,包括您的徽标。

如果您将容器类的宽度强制为 80%,这可以解决任何调整大小的问题。您的文本可能会增长和缩小,但位置会保持不变。我在您的代码笔中进行了测试,并且可以正常工作。

.container { width: 80%; }

或者,由于您可能不想更改整个类,您可以向导航栏容器添加一个 ID,并以相同的方式定位其宽度。

如果有帮助请告诉我

干杯

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-07-02
    • 1970-01-01
    • 1970-01-01
    • 2022-11-14
    • 1970-01-01
    • 1970-01-01
    • 2014-03-01
    相关资源
    最近更新 更多