PDA

View Full Version : extra height space mystery


dsnyder
07-14-2009, 03:30 PM
I just can't figure what is causing the gap between an image and a bottom element of the page. Screen shot A, see 1px gap above bottom purple box. Gap not noticeable or not there in screen shot B.

Here is the relevant html (i think)

<div id="contentwrap">
<!-- InstanceBeginEditable name="Content" -->
<img src="images/home_img.png" alt="" width="760" height="480" border="0" " />
<!-- InstanceEndEditable -->
</div>


<div class="artists">
<ul style="float:left; padding:10px 0px 10px 0px; width:760px; background-color:#A799B2 " >
<li style="font-weight:bold; color:#000; padding-left:25px">Cleveland Chamber Composers | &nbsp;</li>
<li><a href="byrnes.html">Garrett Byrnes</a> &nbsp;&nbsp;&nbsp;</li>
<li><a href="doles.html">Kurt Doles</a> &nbsp;&nbsp;&nbsp;</li>
<li ><a href="emerson.html">Ty Alan Emerson</a> &nbsp;&nbsp;&nbsp;</li>
<li ><a href="underhill.html">Nicholas Underhill</a> &nbsp;&nbsp;&nbsp;</li>
</ul>
</div>some Css:

#contentwrap {width: 760px;margin: 0 auto 0 auto;}
.artists ul {margin: 0 0 0 0 !important; padding: 0 0 0 0; text-align:left; font-size:75%;}
.artists li {display: inline;white-space: nowrap;margin: 0;padding: 0 0;text-transform: none;}

http://chambercollective.com/scrShotA.png

Screen shot B - no gap?

http://chambercollective.com/scrShotB.png

domedia
07-14-2009, 05:35 PM
Can you put this somewhere on the web, Derek?

DWcourse
07-14-2009, 07:08 PM
It doesn't make sense, but try getting rid of any extra spaces, line breaks around the image:

<div id="contentwrap">
<!-- InstanceBeginEditable name="Content" --><img src="images/home_img.png" alt="" width="760" height="480" border="0" " /><!-- InstanceEndEditable --></div>
<div class="artists">

Sometimes it works.

domedia
07-14-2009, 07:28 PM
It depends on the whole document. Right now I don't even know what kind of document this is, plus the whole context and being able to troubleshoot in the browser.