html - CSS width with IE7: inline-block not working even after hacks -
i trying display list of images text on webpage. in ie7, displaying each image below other , not next other. looks because of lack of support of inline-block. read articles , added things css, still not working.
he html:
<div id="image_example"> <div class="accept"> <h4>acceptable</h4> <img width="84" height="150" src="some-image" alt="accept"> </div> <div class="unaccept"> <h4>unacceptable</h4> <img width="112" height="150" src="some-image""> </div> <div class="unaccept"> <h4>unacceptable</h4> <img width="215" height="150" src="some-image"> </div> <divclass="unaccept"> <h4>unacceptable</h4> <img width="165" height="150" alt="unaccept" src="some-image""> </div> </div>
my css looks this::
.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 }
i added last 2 lines after reading lot of articles/ pages problem. still not working.
i tried adding: *width:173px class accept, breaking when image width more, if increase width width of accept classes(even image width less getting increased, page not again).
can please me out? want display these images next each other default widths.
ie7 supports inline-block
on elements inline default.
use float: left;
instead, works following standards, without ie hacks:
.image_example { overflow: hidden; } .unaccept, .accept { float: left; text-align: center; margin: 0 0.75em; }
Comments
Post a Comment