html - Padding have a effect on ::after -


i want create list item, 1 class.

but have effect on ::after , ::before. how can prevent that?

for example, force ::after stand still , increase padding of class?

    .magic {       width: 100%;       height: 30px;       background: #57ab27;       color: white;       font-size: 20px;       padding-top: 6px;       text-align: center;       font-family: "arial", arial, sans-serif;     }      .magic::before {       content: "\f067";       font-family: fontawesome;       font-style: normal;       font-weight: normal;       text-decoration: inherit;       /*--adjust necessary--*/        display: block;       color: #fff;       font-size: 18px;       padding-right: 0.5em;       position: absolute;       top: 17px;       left: 20px;     }      .magic::after {       content: "";       display: block;       width: 5px;       height: 36px;       background: white;       position: relative;       left: 40px;       top: -29px;     } 

http://codepen.io/loose11/pen/doyvbv

thank you!


Comments

Popular posts from this blog

java - Custom OutputStreamAppender not run: LOGBACK: No context given for <MYAPPENDER> -

java - UML - How would you draw a try catch in a sequence diagram? -

c++ - No viable overloaded operator for references a map -