CSS is kicking my a**

September 28, 2005 6:44 PM

CSS Problem: I've been remaking my portfolio for way to long and I have a final css glitch I haven't been able to figure out.

You can see the page here: linkylinklink. My problem is that that when the window is resized, the largest image moves, and I can't figure out how to position it correctly. If I give it a position: absolute; it breaks the description text below (which needs to be relative to the bottom of the image, as not all images are the same height). I'm terrible at coding, and I appriciate the time anyone takes on this. I have a friend who normally helps me with these things but he's swamped with work and I don't know where else to turn.

posted by atom128 to computers & internet (4 comments total)

I don't have time to analyze the whole thing, but at a quick glance, it looks to me like all you'd need to do is enclose the picture and its caption in an absolutely-positioned div, and then relatively position each within that div.
posted by cerebus19 at 9:22 PM on September 28, 2005

i agree with cerebus...

also I'd take care of these small errors while you're at it.
posted by freudianslipper at 9:24 PM on September 28, 2005

I think this is caused by the use of percentages for the width and margins of the #links block. I changed the width to "auto" and the left margin to "5em". This fixed the problem in Firefox 1.5 beta; I haven't tested it in any other browsers, so YMMV.
posted by bpt at 9:31 PM on September 28, 2005

yeah i suspected there were percentages after I posted. i think bpt is right. I tested on my firefox 1.0.7 and it seems to be the % on the margin for #links, as bpt mentioned. If you change it to "px" or "em" it doesn't move.

I didn't think that was it at first, but I notice that the image is wrapped within the links div.
posted by freudianslipper at 9:48 PM on September 28, 2005