SyntaxFix

[css] Using :before CSS pseudo element to add image to modal

1.this is my answer for your problem.

.ModalCarrot::before {
content:'';
background: url('blackCarrot.png'); /*url of image*/
height: 16px; /*height of image*/
width: 33px;  /*width of image*/
position: absolute;
}

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 • Read input from a JOptionPane.showInputDialog box • Disable click outside of angular material dialog area to close the dialog (With Angular Version 4.0+) • How can I display a modal dialog in Redux that performs asynchronous actions? • Angular 2.0 and Modal Dialog • How to use Bootstrap modal using the anchor tag for Register? • Bootstrap modal opening on page load • Trying to make bootstrap modal wider • How to present a modal atop the current view in Swift • Send parameter to Bootstrap modal window? • Set bootstrap modal body height by percentage

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