Codayalacle
New Member
I can't seem to figure out why this extra 5px is showing up at the bottom of my div when it contains two images. It does not happen when it only contains one image. I have removed all other markup and css and the problem remains. Also it happens on Chrome, Firefox, and IE.Html:\[code\]<!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" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html"><head> <link rel="stylesheet/less" href="http://stackoverflow.com/questions/13807247/<?php echo THEMES_URI; ?>starter_digital/style.less" type="text/css"> <script src="http://stackoverflow.com/questions/13807247/<?php echo THEMES_URI; ?>starter_digital/javascript/less-1.3.1.min.js" type="text/javascript"></script></head><body> <div id="social"> <img src="http://stackoverflow.com/questions/13807247/<?php echo THEMES_URI; ?>starter_digital/images/facebook.png" /> </div> <br /> <div id="social"> <img src="http://stackoverflow.com/questions/13807247/<?php echo THEMES_URI; ?>starter_digital/images/twitter.png" /> </div> <br /> <div id="social"> <img src="http://stackoverflow.com/questions/13807247/<?php echo THEMES_URI; ?>starter_digital/images/facebook.png" /> <img src="http://stackoverflow.com/questions/13807247/<?php echo THEMES_URI; ?>starter_digital/images/twitter.png" /> </div></body></html>\[/code\]Less / Css:\[code\]#social { background-color: red;}\[/code\]Result:
