Answers for "css ::after"

CSS
0

scss ::after

p {
    margin: 2em auto;

    > a {
        color: red;
    }

    &:before {
        content: "";
    }

    &:after {
        content: "* * *";
    }
}
Posted by: Guest on March-04-2020
23

css before after

The ::before and ::after pseudo-elements in CSS allows you to insert content onto a page without it needing to be in the HTML. While the end result is not actually in the DOM, it appears on the page as if it is, and would essentially be like this:

div::before {
  content: "before";
}
div::after {
  content: "after";
}
<div>
  before
  <!-- Rest of stuff inside the div -->
  after
</div>

The only reasons to use one over the other are:

You want the generated content to come before the element content, positionally.
The ::after content is also “after” in source-order, so it will position on top of ::before if stacked on top of each other naturally.
Posted by: Guest on April-01-2020
1

css after not working

/*Add the property: content: ""; */ 

.myclass:{
  content: "";
  ...
}
Posted by: Guest on January-19-2021
0

after element is blocking

.select:after {
    position:absolute;
    bottom:.15em;
    top:.15em;
    right:.5rem;
    content:'2193';
    pointer-events: none;
}
Posted by: Guest on June-04-2020
0

how use befor after for image

/* for child  */

.custom_img:after {
    content: "";
    background-color: #2359cf;
    height: 400px;
    width: 70%;
    top: -15px;
    right: -6px;
    position: absolute;
    z-index: 999;
}
Posted by: Guest on November-02-2020
0

::after

a::after {
  content: "whatever content you want to display";
  /*css declaration*/
}
Posted by: Guest on July-17-2021

Browse Popular Code Answers by Language