css rotar un pseudo: después o: antes de contenido:""

Question

css rotar un pseudo: después o: antes de contenido:""

De todos modos para hacer un trabajo de rotación en el pseudo

content:"\24B6"?

Estoy tratando de rotar un símbolo unicode.

128

css rotation css3 pseudo-element

Author: BoltClock, 2012-03-20

Source

2 answers

.process-list:after{
    content: "\2191";
    position: absolute;
    top:50%;
    right:-8px;
    background-color: #ea1f41;
    width:35px;
    height: 35px;
    border:2px solid #ffffff;
    border-radius: 5px;
    color: #ffffff;
    z-index: 10000;
    -webkit-transform: rotate(50deg) translateY(-50%);
    -moz-transform: rotate(50deg) translateY(-50%);
    -ms-transform: rotate(50deg) translateY(-50%);
    -o-transform: rotate(50deg) translateY(-50%);
    transform: rotate(50deg) translateY(-50%);
}

Puede comprobar este código . espero que lo entiendas fácilmente.

0

Author: saddamwp,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-07-04 19:24:22

score 276 · Accepted Answer

Los elementos en línea no se pueden transformar, y los pseudo elementos están en línea de forma predeterminada, por lo que debe aplicar display: block o display: inline-block para transformarlos:

#whatever:after {
  content:"\24B6";
  display: inline-block;
  -webkit-transform: rotate(30deg);
  -moz-transform: rotate(30deg);
  -o-transform: rotate(30deg);
  -ms-transform: rotate(30deg);
  transform: rotate(30deg);
}

<div id="whatever">Some text </div>