Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win


IE7 and images spacing

Posted on 2007-12-05
Medium Priority
Last Modified: 2013-12-25

This is probably a really stupid question,  but im having total brain freeze and cant figure this one out.  Basically I have three images that are slices of the same image in a wrapper div that are the width of the wrapper.

For some reason in IE7 the images appear with a 3px bottom margin, ive already tiried setting the border to 0, and collapsing the border with no success.  in firefox the images appear one after another as they should.

Any suggestions, welcome

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="http://pattern/webcd/js/mootools.js"></script>
<script type="text/javascript" src="http://pattern/webcd/js/modal.js"></script>
<script type="text/javascript" src="http://pattern/webcd/js/loader.js"></script>
<link type="text/css" rel="stylesheet" href="http://pattern/webcd/css/modal.css" />
<title>Llewelyn &amp; Company</title>
<style type="text/css">
		background:#F2E8DE url('images/BG-pattern.gif') repeat;
		margin:0 ;
	<div id="wrapper">
	<img src="images/TopV2.jpg" alt="Online Store Comming Soon" border="0" />
	<img src="images/MiddleV2.jpg" alt="" border="0"/>
	<a class="amseru_box" href="http://geraintp.wufoo.com/forms/llewelyn-co/" rel="{handler:'iframe',size:{x:650,y:550}}">
	<img src="images/BottomV2.jpg" alt="" border="0"/>	</a></div>

Open in new window

Question by:gxp071
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
LVL 28

Accepted Solution

TName earned 500 total points
ID: 20410206
Just a guess - try

#wrapper img{ display:block; }
#wrapper img{ vertical-align:bottom; }

Author Comment

ID: 20410214
Cheers, display block did the trick....
LVL 28

Expert Comment

ID: 20410226
Just to explain the problem: the images (inline elements in strict mode) will "float" on the font base line instead of the bottom line...

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

FAQ pages provide a simple way for you to supply and for customers to find answers to the most common questions about your company. Here are six reasons why your company website should have a FAQ page
Dramatic changes are revolutionizing how we build and use technology. Every company is automating, digitizing, and modernizing operations. We need a better, more connected way to work together as teams so we can harness the insights from our system…
The viewer will learn how to count occurrences of each item in an array.
Any person in technology especially those working for big companies should at least know about the basics of web accessibility. Believe it or not there are even laws in place that require businesses to provide such means for the disabled and aging p…

618 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question