• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 333
  • Last Modified:

is there a way to make the image the same width as the div

<style>
    div.col1{width:10%;border-width:1px;border-color:'.$row_color.';border-style:solid;float:left;}
    div.col2{width:50%;border-width:1px;border-color:'.$row_color.';border-style:solid;float:left;}
    div.col3{width:40%;border-width:1px;border-color:'.$row_color.';border-style:solid;float:left;}
</style>

images appear in the div larger than the div width

is there a way to make the image the same width as the div

<img src="pic.jpg" width="40%">
0
rgb192
Asked:
rgb192
2 Solutions
 
apathy42Commented:
Check out this thread, I think it has some helpful options:

http://stackoverflow.com/questions/3029422/image-auto-resize-to-fit-div-container
0
 
Ishaan RawatDesigner | Developer | ProgrammerCommented:
Add the following style...

.fitParent{
width: 100% !important;
height: auto;
}

Open in new window


and then wrap it with the div which you want the image to resize with ...

For eg...

<div class="col1">
   <img class="fitParent" src="imagePath.imgFormat" alt="">
</div>

Open in new window


What it will do is it will make the image width equal to the width of the parent tag that is div.col1....

Try this and if any problem is there comment below....
0
 
rgb192Author Commented:
thanks
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now