.elist { padding: 20px 23px 52px 23px; .eitem { border-radius: 6px; padding: 31px; background: #FFFFFF; display: flex; flex-flow: row nowrap; margin-bottom: 17px; position: relative; overflow: hidden; .einfor { width: 100%; position: relative; .etitle { font-size: 30px; display: flex; flex-flow: column; padding-bottom: 10px; .ename { flex: 1; padding-right: 20px; font-weight: bolder; display: flex; flex-direction: row; align-items: center; } .ecode { font-size: 24px; font-weight: 400; } } .etime { font-size: 30px; padding-bottom: 10px; } .euserName { font-size: 25px; color: #999999; padding-bottom: 10px; display: flex; flex-flow: row nowrap; align-items: center; justify-content: space-between; position: relative; .euNtext { width: 540px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } } .emore { font-size: 26px; margin: 10px 0; color: #58A3FF; } } } } .ereject { font-size: 24px; position: absolute; right: -31px; top: 0px; border-bottom-left-radius: 100px; border-top-left-radius: 100px; padding: 15px; color: white; background: rgba(22, 155, 213, 1); } .eselect { font-size: 24px; position: absolute; right: -31px; top: 100px; border-bottom-left-radius: 100px; border-top-left-radius: 100px; padding: 15px; color: white; background: #F1662F; } .sadd { -webkit-flex: none; -ms-flex: none; flex: none; display: block; margin-left: 10PX; padding: 0 10PX; height: 30PX; color: #FFF; font-size: 14PX; line-height: 30PX; border-radius: 4PX; background-color: green; -webkit-transition: margin-right 0.3s, opacity 0.3s; -o-transition: margin-right 0.3s, opacity 0.3s; transition: margin-right 0.3s, opacity 0.3s; margin: 12px 10px; }