Sent by Dave Redfern on 28 March 2004 13:01
Hello,
I am currently working on redoing my site completely in CSS with the general
idea of being able to keep the entire layout out of the page separate from
the content (a-la www.csszengarden.com). Now I have most of it sorted and
looking half decent in IE6, Opera 7.23 and Firefox 0.8 - that is until you
look at the portfolio section. The links below are for the general index
page, the portfolio and the blue CSS file (there are 2 other css files atm
but I want to get this one working properly first!):
http://dev.madagasgar.com/
http://dev.madagasgar.com/portfolio/
http://dev.madagasgar.com/css/blue/style.css
The home page displays fine, even in IE6 (well minus the transparency in the
top navigation bar) - the problems arise in the portfolio. This is an
auto-generated listing of stuff I have worked on, showing 4 items per page.
The problem is that Firefox is not displaying the images correctly. They end
up being "pushed" down to the bottom of the list and overlapping, or being
displayed almost in a 2 x 2 square arrangement but overlapping the last item
obscuring the text.
The image thumbnail should be displayed to the left of the summary text. IE6
and Opera 7.23 render this correctly. The summary text is held in a
separately ID'd div tag after the image.
I have spent hours on it so far going round in circles trying out different
combinations, but nothing seems to have worked. I am guessing it is some
really stupid mistake that I've made with the floats or display, but I can
not see what I have done wrong! And I think that using IDs for this was
wrong, but it is still experimental so I may change to classes...
Any ideas from a fresh set of eyes would be greatly appreciated!
Dave Redfern
-----------------------------------------
e: [EMAIL-REMOVED]
u: www.madagasgar.com
-----------------------------------------
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/