потому что не вижу путь и/или эти контейнеры уже со значениями и я короче хожу по кругу
Несколько советов:
1. Не редактируй в браузере. Используй Notepad++, скопируй оба окна из своего Стиля туда и сохрани с расширением .css. И редактируй эти два файла.
2. Ищешь нужное место через инструмент веб-разработчика, смотришь и копируешь нужный селектор, ищешь его в поиске Notepad++ редактируешь. Это может дольше, но нагляднее, чем в браузере.
3. Делай весь код однообразным. Да, машине лучше код в одну строчку, но человеческий глаз лучше всего воспринимает вот такую структуру кода:
.post-author:not(.online) .pa-avatar .acchide {
background: #a3a3a3 !important;
}
насчёт !important, ну уж простите, приходится ставить и на каждое значение
Чем усложняешь себе жизнь, начинается дублирование, вписание лишнего кода и т.п. Пример:
.post-author .pa-online,
.post-author:not(.online) .pa-avatar .acchide {
position: absolute;
display: inline-block !important;
top: 6px;
right: -6px;
left: auto !important;
line-height: unset;
background: #49cd00 !important;
height: 50px;
width: 6px;
margin: 0 0 0 -5px !important;
padding: 0 !important;
border: 0 !important;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 0%;
cursor: help;
}
И ниже:
.post-author:not(.online) .pa-avatar .acchide {
background: #a3a3a3 !important;
}
Понятное дело, Что нижний код без !important не будет работать, но не проще ли вообще фон из верхнего кода вынести и расписать его отдельно? Отдельно для .post-author .pa-online и отдельно для .post-author:not(.online) .pa-avatar .acchide. Зачем они в общем коде, если используют разный фон? В общем коде должны содержаться значения, которые одинаковые для этих селекторов.
Чем больше !important применяешь, тем больше придется его добавлять и перебивать, тем больше кода, тем больше в итоге путаницы. Идет зависимость от него там, тут, и дальше и дальше.