View Full Version : captions under images (but with a twist I swear)

12-10-2005, 11:03 PM
Alright, the site I actually do wanted to make it scalable. So I took it to mean they wanted it to be totally redone but with the same basic apperance. So a rough DIV heavy version has come to the surface and so far (minus the IE bug) so good.

the link:


the problem:

Im using the CSSPlay way to simulate min-width in IE. The divs are cluttered as all get out and the content (#text) is floated right. At the very top of the content section there are 5 images. I only have the same image repeated right now as it's the largest height wise and I tried different approches.

What I want it to do:

i want all 5 of the images to be centered and break down accordingly in screen resolutions (ie. 5 across, 4/1, 2/2/1 etc...)

Without captions it works with a text-align center applied. I have done it before but I haven't done it yet with a min-width approach or a scalable layout.

Problem is maybe the doctype or the fact that the whole box is floated. If I wrap the images in a span and disply block them i can align the text but IE freaks out when you scale the site down and the images overflow the content area (p).

The same happens if I float the images.

I've tried numerous approaches and haven't found a way to make it work yet.
The table approach I 'thought' was what i needed but it froze the containing P and kept it from resizing.

i don't know if the problem is the cssPlay min-width, my centering it, the 96 containing divs or just way too much going on for my own good.

the html of the <P>, I want to center and yet break down upon scaling:

<p class="toplogos">
<img src="fnm.gif"><img src="fnm.gif"><img src="fnm.gif"><img src="fnm.gif"><img


the css that is applied to the p in question:

p.toplogos {
width: 100%;
position: relative;
text-align: center;
.toplogos img {
width: 125px;

I know there has to be more than what I posted as code involved, but as of right now, the code is even too messy for me. The CSS is still in the HTML on the page so it's all there in one place if you look at it.


And a total side note question:

I havent even tried to validate this steaming pile yet but is there a conflict if I put an <IMG> inside a <h4> ? It works with the doctype and was needed to make it work right.

as always,