@import "~assets/less/variable"; .wrapper { width: 100%; height: 100%; overflow-y: auto; .container { width: 100%; height: auto; max-width: 970px; margin: 24px auto; display: flex; flex-direction: row; justify-content: flex-start; .sidebar { width: 186px; margin-right: 16px; display: flex; flex-direction: column; .user { margin-bottom: 16px; .userWrap { padding: 24px; display: flex; flex-direction: column; align-items: center; border: 1px solid @grey-line-color; .userAvatar { flex-shrink: 0; } .userItems { flex: 1; margin-top: 16px; width: 136px; text-align: left; -webkit-box-orient: vertical; overflow: hidden; .userName { font-size: 18px; font-weight: 600; } .userDesc { margin-top: 6px; display: inline-block; max-width: 100%; color: @light-text-color; } } } } .menu { } } .content { flex: 1; width: 640px; } } }