Mubbowcarcorb
New Member
I am trying to display a list of images with text on my webpage. But in IE7, it is displaying each image below the other and not next to other. Looks like it is because of lack of support of inline-block. I read some articles and added some things to my CSS, but still it is not working.He is the HTML:\[code\] <div id="image_example"> <div class="accept"> <h4>Acceptable</h4> <img width="84" height="150" src="http://stackoverflow.com/questions/15828995/some-image" alt="accept"> </div> <div class="unaccept"> <h4>Unacceptable</h4> <img width="112" height="150" src="http://stackoverflow.com/questions/15828995/some-image""> </div> <div class="unaccept"> <h4>Unacceptable</h4> <img width="215" height="150" src="http://stackoverflow.com/questions/15828995/some-image"> </div> <divclass="unaccept"> <h4>Unacceptable</h4> <img width="165" height="150" alt="unaccept" src="http://stackoverflow.com/questions/15828995/some-image""> </div> </div>\[/code\]My CSS looks like this::\[code\].unaccept, .accept{ display: inline-block; text-align: center; margin: 0 0.75em; zoom:1;//Added after reading other posts *display:inline; //Added after reading other posts } \[/code\]I added the last two lines after reading a lot of articles/ pages about this problem. But still it is not working.I tried adding: *width:173px to the class accept, but then it is breaking when the image width is more, if I increase the width width of all accept classes(even where the image width is less is getting increased, so the page does not look good again).Can someone please help me out? All I want is to display these images next to each other with their default widths.