# 更改头像位置

**URL:** <https://meta.discourse.org/t/change-avatar-position/293192>\
**Category:** Development\
**Tags:** css\
**Created:** [2024 年1 月 28 日 13:52 UTC](https://meta.discourse.org/t/change-avatar-position/293192 "2024-01-28T13:52:07Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

作者： ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)\
发布日期： [2024 年1 月 28 日 18:12 UTC](https://meta.discourse.org/t/change-avatar-position/293192/4 "2024-01-28T18:12:40Z")

</div>

您能试试这个 _桌面_ CSS 吗？

```css
.topic-post {
    $avatar_width: 60px;
    $topic_margin_body: 1em;

    .topic-body {
        width: calc(690px + var(--topic-body-width-padding) * 2 + $avatar_width + $topic_margin_body) !important;
    }

   .topic-avatar {
        position: absolute !important;
        left: calc(var(--topic-body-width-padding) * 2 + $topic_margin_body);
        margin-bottom: 0 !important;
    }

    &.sticky-avatar .topic-avatar {
        top: unset !important;
    }

    .names.trigger-user-card {
        margin-left: calc(var(--topic-avatar-width) + var(--topic-avatar-width) / 2);
        height: $avatar_width;
    }
}

```

 ![image](https://global.discourse-cdn.com/meta/original/4X/9/1/0/910acaf9bd10c2e116bd1d3cfb9920609b1e7088.png)

---

_[View the full topic](https://meta.discourse.org/t/change-avatar-position/293192)._