Css inset

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

0 vote274 views1 answer
Get into a Docker container bash
CSS
10 votes257 views2 answers
Import css in another css file
CSS
0 vote250 views2 answers
Text-align: left; width: 100%;
CSS
-1 vote227 views1 answer
Centralize div css
CSS
0 vote241 views1 answer
Estilos de scroll css
CSS
3 votes231 views2 answers
Css color when clicked
CSS
5 votes245 views1 answer
Force to load https
CSS
0 vote242 views1 answer
Simple font-face mixin scss
CSS
0 vote262 views2 answers
Centralizing a table with css
CSS
19 votes259 views2 answers
How to underline font in css
CSS