Hi guys,

Another colleague problem here (seems I'm the officially elected rep for
css-d):

These three floats are level in Internet Explorer but not in Firefox for
some reason. Most baffling.

Due to privacy issues I'm unfortunately not able to share the site with you,
but I can show you a screenshot (off-list).

The columns look like this:

|--------------| ANNOYING GAP HERE
|              | |--------------| |--------------|
|              | |              | |              |
|              | |              | |              |


Here is the code:

<div class="gallery">
<div class="gcol1">
<ul class="col1ul">
                   <li><img src="image.jpg" class="pic" width="250"
height="188" alt="image of a balloon" title="snowman" /></li>
                   <li><img src="image.jpg" class="pic" width="250"
height="188" alt="picture of a cathedral and balloons" title="cathedral"
/></li>
                   <li><img src="image.jpg" class="pic" width="250"
height="188" alt="picture of an arch of balloons" title="balloon arch"
/></li>
                   <li><img src="image.jpg" class="pic" width="250"
height="188" alt="picture of an army band and balloons" title="army" /></li>
                   <li><img src="image.jpg" class="pic" width="250"
height="188" alt="picture of balloons being released" title="release"
/></li>
              </ul>
</div>
<div class="gcol2">
<ul class="col1ul">
                   <li><img src="image.jpg" class="pic" width="250"
height="188" alt="image of a balloon at a function table" title="" /></li>
                   <li><img src="image.jpg" class="pic" width="250"
height="188" alt="image of balloons promoting a store" title="store" /></li>
                   <li><img src="image.jpg" class="pic" width="250"
height="188" alt="picture of multi-coloured balloons" title="multi" /></li>
                   <li><img src="image.jpg" class="pic" width="250"
height="188" alt="picture of an arch of balloons over a honda car"
title="honda" /></li>
                   <li><img src="image.jpg" class="pic" width="250"
height="188" alt="picture of a council building decorated with balloons"
title="council" /></li>
              </ul>
</div>
<div class="gcol3">
<ul class="col3ul">
                  <li><img src="image.jpg" class="pic" width="250"
height="188" alt="picture of an arch of balloons" title="arch" /></li>
                  <li><img src="image.jpg" class="pic" width="250"
height="188" alt="picture of a car made of balloons" title="balloon car"
/></li>
                  <li><img src="image.jpg" class="pic" width="250"
height="188" alt="picture of two flowers made from balloons" title="flowers"
/></li>
                  <li><img src="image.jpg" class="pic" width="250"
height="188" alt="photo of an anchor made of balloons" title="anchor"
/></li>
                  <li><img src="image.jpg" class="pic" width="250"
height="188" alt="image of an arch of balloons" title="arch" /></li>
             </ul>
</div>
<div class="gallerytext">
<p>Content</p>
</div>
<div id="rest">
<br />
</div>
</div>

.gcol1
{
float: left;
text-align: center;
width: 260px;
margin: 0;
padding: 0;
}

.gcol2
{
float: left;
text-align: center;
width: 260px;
margin: 0;
padding: 0;

}

.gcol3
{
float: right;
text-align: center;
width: 260px;
margin: 0;
padding: 0;

}

.col1ul
{
list-style-type: none;
padding: 0;
margin: 0;
}

.col2ul
{
list-style-type: none;
padding: 0;
margin: 0;
}

.col3ul
{
list-style-type: none;
margin: 0;
padding: 0;
}

.gallery
{
width: 780px;
}

.gallerytext
{
width: 65%;
float: left;
text-align: justify;
background: #eee;
margin-left: 6px;
margin-top: 0;
}

#rest
{
clear: both;
}

Sorry not to be able to offer more. Thanks for any help.
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to