How to Make IMG As Wide As the DIV
IMG and DIV are HTML tags used in the construction of websites. The IMG tag calls forth an image based on a URL, while the DIV tag defines a section within the HTML page. The two tags often overlap, with an IMG tag inside a DIV tag. Use Cascading Style Sheets to make an IMG tag's image as wide as the DIV section.
Other People Are Reading
Instructions
-
-
1
Set up CSS in your HTML document by adding the tags <style type="text/css"> and </style> between the <head> and </head> tags.
-
2
Add the selector IMG { } between the <style type="text/css"> and </style> tags. This will indicate to the Web browser processing the page that you have established a preset style for the IMG tag.
-
-
3
Fill the IMG { } selector with the following properties:
width: 100%;
height: 100%;
max-width: 100%;
Together, these properties will ensure that the image displayed by any IMG tag will have a height and width that completely fills its containing block -- which in this case is a DIV.
-
1
