.parent { width: 100%; height: 72px; display: flex; flex-direction: row; align-items: center; padding-right: 10px; } .dateLayout { width: 56px; display: flex; flex-direction: column; justify-content: center; align-items: center; padding-top: 10px; } .dateItem, .timeItem { text-align: center; font-size: 13px; } .arrowLayout { display: flex; height: 100%; flex-direction: column; align-items: center; } .arrowLine { flex: 1; width: 1px; background: #cccccc; } .noLine { flex: 1; width: 1px; background: transparent; } .headerImg { width: 35px; height: 35px; margin-left: 10px; } .contentLayout { display: flex; flex-direction: column; justify-content: center; flex: 1; height: 100%; margin-left: 10px; } .nameItem { color: #999999; font-size: 13px; } .opinionItem { color: #999999; font-size: 12px; overflow-y: scroll; } .opinionItem::-webkit-scrollbar { display: none; } .stateItem { color: #999999; margin-bottom: 20px; font-size: 12px; }