CSS sqrt() function

Definition and usage

CSS ' sqrt() The function returns the square root of a number.

example

in calc() function used in sqrt() To set the width and height of three <div> elements:

div.a {
  width: calc(50px * sqrt(16)); /* 200px */
  height: calc(50px * sqrt(9)); /* 150px */
  background-color: salmon;
  margin-bottom: 25px;
}
div.b {
  width: calc(20px * sqrt(16)); /* 80px */
  height: calc(20px * sqrt(9)); /* 60px */
  background-color: green;
  margin-bottom: 25px;
}
div.c {
  width: calc(60px * sqrt(16)); /* 240px */
  height: calc(60px * sqrt(9)); /* 180px */
  background-color: maroon;
}

Try it yourself

CSS syntax

sqrt(x)

Technical details

Browser support

The numbers in the table represent the first browser version to fully support this function.

Related pages

Reference:CSS acos() function

Reference:CSS asin() function

Reference:CSS atan() function

Reference:CSS atan2() function

Reference:CSS calc() function

Reference:CSS cos() function

Reference:CSS exp() function

Reference:CSS hypot() function

Reference:CSS log() function

Reference:CSS mod() function

Reference:CSS sin() function

Reference:CSS tan() function