How to set width and height of background image in percent with respect to parent element in CSS ?
If we are using an image as a child and want to set the height and width in percentage then we need to set the parent element with some fixed size.
- Here we will use CSS inside the tags which are also known as inline CSS.
- For parent div we will give fixed size by giving height: 500px and width: 40% according to screen size, and we will give it background color and border to clearly make the parent visible.
- Now for the child image, we will give width: 60% and height: 70%.
- Here we will write the CSS in style tag also known as inline CSS.
- Now we will give the parent fixed size by giving it height: 500px and width: 40% and to define the parent clearly we will give border-color and background-color.
- Finally, we will give the image width: 50% and height: 45%.
My Personal Notes arrow_drop_up