SyntaxFix

[css] css rotate a pseudo :after or :before content:""

Inline elements can't be transformed, and pseudo elements are inline by default, so you must apply display: block or display: inline-block to transform them:

_x000D_
_x000D_ 
#whatever:after {
  content: "\24B6";
  display: inline-block;
  transform: rotate(30deg);
}
_x000D_ 
<div id="whatever">Some text </div>
_x000D_
_x000D_
_x000D_

Examples related to css

• need to add a class to an element • Using Lato fonts in my css (@font-face) • Please help me convert this script to a simple image slider • Why there is this "clear" class before footer? • How to set width of mat-table column in angular? • Center content vertically on Vuetify • bootstrap 4 file input doesn't show the file name • Bootstrap 4: responsive sidebar menu to top navbar • Stylesheet not loaded because of MIME-type • Force flex item to span full row width

Examples related to rotation

• Setting device orientation in Swift iOS • Statically rotate font-awesome icons • CSS3 transition on click using pure CSS • JS Client-Side Exif Orientation: Rotate and Mirror JPEG Images • Rotate an image in image source in html • Rotate a div using javascript • HTML5 Canvas Rotate Image • CSS3 Rotate Animation • CSS rotation cross browser with jquery.animate() • Rotating a Vector in 3D Space

Examples related to pseudo-element

• CSS pseudo elements in React • Add line break to ::after or ::before pseudo-element content • Using CSS :before and :after pseudo-elements with inline CSS? • Combine :after with :hover • Can I have multiple :before pseudo-elements for the same element? • :after and :before pseudo-element selectors in Sass • Creating a border like this using :before And :after Pseudo-Elements In CSS? • css rotate a pseudo :after or :before content:"" • Can I change the height of an image in CSS :before/:after pseudo-elements? • Using :before CSS pseudo element to add image to modal