# 使用 CSS 隐藏群组详情页的活动或消息标签页
**URL:** https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447
**Category:** Support
**Created:** [2018年十一月6日 18:53 UTC](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447 "2018-11-06T18:53:27Z")
**Posts on this page:** 10
**Page:** 1
### Author:  [@JoelZaslofsky](https://meta.discourse.org/u/JoelZaslofsky)
#### Post date: [2018年十一月6日 18:53 UTC](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447/1 "2018-11-06T18:53:28Z")
**Update 2018-11-30: The CSS to hide the Activity and Messages tabs [is here](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447/7).**
tl;dr – what CSS can I use to remove the Activity and Messages tabs on a group detail page (e.g., … /groups/YourGroupName/)?
* * *
My question was already [asked in July 2017 here](https://meta.discourse.org/t/groups-hide-members-and-activity-tabs/65988) and didn’t get a response. So I’m asking in a different category and with different eyeballs available.
[Sam told me](https://meta.discourse.org/t/add-a-sortable-group-join-date-and-options-to-hide-group-detail-page-items/100826/2) it was possible to hide the Activity and Messages tabs on the group detail page. As it is, the Activity tab in each group shows the _general_ forum activity for all members in the group – which is really confusing to people who are used to Facebook groups and just generally counter-intuitive to many of our community members.
Since we have direct messaging to groups turned off for all our groups, the presence of the Messages tab also is a distraction for us.
What’s the CSS code to hide the Activity and Messages tabs in the screen shot above?
You also get bonus points if you know how to hide certain columns like Posted and Seen on the Members tab of the groups detail page (e.g., found at … /groups/YourGroupName/).
Thanks in advance for the help, wonderful Discourse folks!
---
### Author:  [@Stephen](https://meta.discourse.org/u/Stephen)
#### Post date: [2018年十一月6日 19:54 UTC](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447/2 "2018-11-06T19:54:58Z")
It’s a bit clunky, but something like:
```
div.container.group.YourGroupNameSlug > div.list-controls > div.container > ul > li {
a.messages.ember-view, a.activity.ember-view {
visibility: hidden;
}
}
```
Should work, the group slug is specified in line one.
---
### Author:  [@JoelZaslofsky](https://meta.discourse.org/u/JoelZaslofsky)
#### Post date: [2018年十一月6日 21:14 UTC](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447/3 "2018-11-06T21:14:12Z")
Thanks for the suggestion, Stephen.
I added your CSS in the Common section of the default theme (e.g., … /admin/customize/themes/1/common/scss/edit) and had two different experiences in desktop and mobile view.
The screen shots below show how it worked at least functionally in desktop view and didn’t work so well in mobile view. Is there another way to approach hiding the Activity and Messages elements – preferably for all groups at once instead of new templated lines of CSS for each group?
## Desktop View
## Mobile View
---
### Author:  [@dax](https://meta.discourse.org/u/dax)
#### Post date: [2018年十一月6日 21:37 UTC](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447/4 "2018-11-06T21:37:59Z")
Try to change
```plaintext
visibility: hidden;
```
with
```plaintext
display: none;
```
---
### Author:  [@JoelZaslofsky](https://meta.discourse.org/u/JoelZaslofsky)
#### Post date: [2018年十一月7日 19:30 UTC](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447/5 "2018-11-07T19:30:58Z")
Thanks for the display: none; tweak, @dax. That helped on desktop view, which now looks like this.
However, mobile view still shows the Activity and Messages options in the drop-down list, and frustratingly, the empty white space that was there before (which must be default theme or environmental related).
Do you know why the CSS would work on desktop view and not mobile view? And do you know if there’s a way to use a wildcard in the CSS to apply the display: none; code to all groups instead of going one-by-one?
---
### Author:  [@Stephen](https://meta.discourse.org/u/Stephen)
#### Post date: [2018年十一月7日 19:50 UTC](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447/6 "2018-11-07T19:50:47Z")
Yes, they use separate CSS and different selectors. Lots of styling differs between mobile and desktop view, that’s part of how responsive design works.
If you swap to a mobile view on Chrome and inspect elements you can identify how it changes and produce the mobile-friendly alternative.
---
### Author:  [@JoelZaslofsky](https://meta.discourse.org/u/JoelZaslofsky)
#### Post date: [2018年十一月30日 17:12 UTC](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447/7 "2018-11-30T17:12:12Z")
FYI everyone. Here’s the CSS to hide the Messages and Activitiy tabs on desktop and mobile view.
**Desktop**
```
.activity.ember-view, .messages.ember-view {
display: none;
}
```
**Mobile**
```
.mobile-nav .activity.ember-view, .mobile-nav .messages.ember-view{
display: none !important;
}
```
---
### Author:  [@Cozdabuch](https://meta.discourse.org/u/Cozdabuch)
#### Post date: [2019年六月23日 06:29 UTC](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447/8 "2019-06-23T06:29:27Z")
is there a way to “unhide” from an admin?
for example, I hid messages and activity from everyone using your code, but replicated it with .viewing-self and display: inline-block
so the user them self can see their message box, but unless admins turn off CSS customization, they’re not able to snoop easily.
What I’l looking to do is the opposite of this. I want to hide the profile picture box, or the pencil (change) button from users, but have it visible to admins, without having to go disable the CSS. Any ideas??
---
### Author:  [@Mr.X\_Mr.X](https://meta.discourse.org/u/Mr.X_Mr.X)
#### Post date: [2021年十一月4日 16:06 UTC](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447/9 "2021-11-04T16:06:18Z")
我想仅在特定页面（例如 /messages）隐藏某些字段，比如隐藏用户信息部分（用户名、头像等）。如何仅通过 CSS 在特定页面隐藏这些元素，而不影响其他页面？
---
### Author:  [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [2021年十一月5日 03:33 UTC](https://meta.discourse.org/t/css-to-hide-the-activity-or-messages-tabs-on-the-group-detail-page/101447/10 "2021-11-05T03:33:49Z")
查看 HTML 的上层部分。每个页面都有一个唯一的类被添加到 `` 标签上。
例如，在 `/messages` 页面上，你会看到如下内容。
这个类不会在其他页面上添加，仅会在消息页面上添加。
Discourse 使用 SCSS。因此，你可以这样嵌套选择器：
```scss
// /messages 页面的样式
.user-messages-page {
// 隐藏用户头像/姓名/用户名
.user-profile-names,
.user-profile-avatar {
display: none;
}
}
```
普通的 CSS 也同样适用。