monks/box_sizing

The box-sizing CSS property sets how the total width and height of an element is calculated.

Values

pub const border_box: #(String, String)
  • : The {{Cssxref(“width”)}} and {{Cssxref(“height”)}} properties include the content, padding, and border, but do not include the margin. Note that padding and border will be inside of the box. For example, .box {width: 350px; border: 10px solid black;} renders a box that is 350px wide, with the area for content being 330px wide. The content box can’t be negative and is floored to 0, making it impossible to use border-box to make the element disappear. Here the dimensions of the element are calculated as: width = border + padding + width of the content, and height = border + padding + height of the content.
pub const content_box: #(String, String)
  • : This is the initial and default value as specified by the CSS standard. The {{Cssxref(“width”)}} and {{Cssxref(“height”)}} properties include the content, but does not include the padding, border, or margin. For example, .box {width: 350px; border: 10px solid black;} renders a box that is 370px wide. Here, the dimensions of the element are calculated as: width = width of the content, and height = height of the content. (Borders and padding are not included in the calculation.)
pub const inherit: #(String, String)
pub const initial: #(String, String)
pub fn raw(value: String) -> #(String, String)

Enter a raw string value for box-sizing

pub const revert: #(String, String)
pub const revert_layer: #(String, String)
pub const unset: #(String, String)
pub fn var(variable: String) -> #(String, String)

Enter a variable name to be used for box-sizing. It will be wrapped in var() and have -- prepended.

Search Document