“Percentages - This unit sets the dimensions of the box relative to the size of the box that it is encased in. For example, consider an element (a box) of class blue set to a height of 200 pixels and a width of 200 pixels. Inside of blue, consider another box of class red, set to a height of 37% and a width of 45%. The resulting dimensions of the red box would be a height of 74 pixels and a width of 90 pixels.”
In there said percentages are relative to the box that they are inside of so, what is the parent box?
what are the borders? What is the parent box that they are encased in?
well if i have this code:
<div>
<img src="image.jpg">
</div>
and i set the image height to 50%, the image is 50% of the parent height. the parent in this case is a div.
thanks but what if we dont have have a <div> element in that case is parent element is <body>
(by the way feel free to correct my sentences, sorry)
yes, in a way:
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
</head>
<body>
<div>
<img src="image.jpg">
</div>
</body>
</html>
now image still has div as a parent, and div has body as a parent.
so if where to set percentage height for div, it would be x % of the height of body. (x being the percentage we specify)
1 Like
This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.