What is inset in css

The inset CSS property is a shorthand that corresponds to the top, right, 
bottom, and/or left properties. It has the same multi-value syntax of the 
margin shorthand.

While part of the CSS Logical Properties specification, it does not define 
logical offsets. It defines physical offsets, regardless of the element's 
writing mode, directionality, and text orientation.

Css inset

/* this */
inset: 1px 2px 3px 4px;

/* is the same as this */
top: 1px;
right: 2px;
bottom: 3px;
left: 4px;

Source: developer.mozilla.org

Inset css

div {
  background-color: yellow;
  width: 120px;
  height: 120px;
}

.exampleText {

  position: relative;
  inset: 20px 50px 30px 10px;
  background-color: #c8c800;
}

Source: developer.mozilla.org

Inset css

div {
  background-color: yellow;
  width: 150px;
  height: 120px;
  position: relative;
}

.exampleText {
  writing-mode: sideways-rl;
  position: absolute;
  inset: 20px 40px 30px 10px;
  background-color: #c8c800;
}

Source: developer.mozilla.org

Similar codes

-2 votes311 views3 answers
Css example
CSS
8 votes322 views5 answers
Flex margin between items
CSS
0 vote319 views1 answer
Code css for mozila
CSS
0 vote295 views3 answers
Image not rendering in tailwind css
CSS
0 vote315 views1 answer
Add expanding underline on page load css
CSS
0 vote286 views1 answer
Restrict css to apply on div
CSS
1 vote322 views1 answer
How to make horizontal rule dotted
CSS
96 votes326 views3 answers
Css hide scrollbar but allow scroll
CSS
0 vote289 views1 answer
Sticky form look blurred
CSS
0 vote346 views1 answer
Hover on father elemet activates a child element css
CSS